Springboot入门：实现简单的增删改查（前后端分离）前端使用vue框架

Spring Boot简介Spring是java企业版的轻量级代替品，为企业java开发提供了一种相对简单的方法，通过依赖注入和面向切面编程，用简单的java对象实现EJB的功能Spring的组件代码是轻量级的，但他的配置却是重量级的。第一阶段：在spring1.X时代，使用Spring开发全部都是xml配置的bean，随着项目的扩大，我们需要把xml配置到不同的配置文件里边，需要频繁的在...

kingslanding demo

4292人浏览 · 2019-12-06 17:05:45

kingslanding demo · 2019-12-06 17:05:45 发布

Spring Boot简介
Spring是java企业版的轻量级代替品，为企业java开发提供了一种相对简单的方法，通过依赖注入和面向切面编程，用简单的java对象实现EJB的功能

Spring的组件代码是轻量级的，但他的配置却是重量级的。

第一阶段：
在spring1.X时代，使用Spring开发全部都是xml配置的bean，随着项目的扩大，我们需要把xml配置到不同的配置文件里边，需要频繁的在开发类和配置文件之间进行切换

第二阶段：注解配置

在Spring2.X时代，随着JDK1.5带来的注解支持，Spring提供声明的注解（例如@Component @sevice），大大减少了配置量。主要使用的方式是应用的基本配置（如数据库配置）用xml，业务配置用注解

第三阶段：java配置

Spring3.0引入了基于Java的配置能力，是一种安全的可以重构的配置文件，可以代替xml，我们目前处于的时代，Spring4.x和spring Boot都推荐适用java配置

Spring Boot的目标
为所有的开发提供一个从根本上更快的入门
开箱即用，通过自己设置参数，快速摆脱这种方式
提供了一些大型项目中非常常见的非公能性特性，如内嵌服务器、安全、指标、健康检测、外部化配置等
绝对没有代码生成，无需配置xml配置

Spring boot入门
1、下载工具STS
地址:https://spring.io/tools3/sts/legacy
通过.eclipseproduct（在eclipse下载目录中）查看java版本下载与之对应的STS工具
查看java版本：
在这里插入图片描述

在官网找到对应的版本的STS进行下载
在这里插入图片描述

解压压缩包并执行可运行的exe
点击运行
2、新建springboot项目
创建方式 file -new-new spring Start
在这里插入图片描述
点击next-finish
一个简单的springboot环境基本搭建完毕
springboot实现增删查改

新建项目的基本结构：
1、在resource中的mapper编写sql语句
2、Java中的mapper所写接口的接口名，与resource中的mapper中的id相对应
3、编写实体类，实体类中的字段名要与数据库中的字段相匹配（注意数据类型）
4、Service层，服务层的接口
5、Seviceimpl，接口的实现类
6、Filter：过滤层，用于过滤路径
7、Controller：控制层，用于处理业务逻辑
8、Pom.xml：添加maven依赖
9、Application.prperties：配置文件的编写
第一步:创建数据库中一张user表
Sql文件（直接运行即可）：
/*
Navicat MySQL Data Transfer

Source Server : 10.2.10.201111
Source Server Version : 50540
Source Host : 10.2.10.201:3306
Source Database : test

Target Server Type : MYSQL
Target Server Version : 50540
File Encoding : 65001

Date: 2019-12-05 15:37:05
*/

SET FOREIGN_KEY_CHECKS=0;

– Table structure for user

DROP TABLE IF EXISTS user;
CREATE TABLE user (
id int(11) NOT NULL AUTO_INCREMENT,
name varchar(100) DEFAULT NULL,
password varchar(100) DEFAULT NULL,
number varchar(100) DEFAULT NULL,
PRIMARY KEY (id)
) ENGINE=MyISAM AUTO_INCREMENT=32142342 DEFAULT CHARSET=latin1;

– Records of user

INSERT INTO user VALUES (‘1’, ‘zhangsan122’, ‘123’, ‘996’);
INSERT INTO user VALUES (‘2’, ‘wangwu’, ‘456’, ‘955’);
INSERT INTO user VALUES (‘3’, ‘lisi’, ‘789’, ‘007’);
INSERT INTO user VALUES (‘4’, ‘’, ‘weu1387’, ‘2938’);

第二步：根据数据表创建实体类

package com.example.demo.entity;
/***
 * 用户实体类
 * @author zyh *
 */
public class User {
	
	
	private Integer page;
	private Integer size;
	private int id;
	private String name;
	private String password;
	private String number;
	public int getId() {
		return id;
	}

	public void setId(int id) {
		this.id = id;  
	}

	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public String getPassword() {
		return password;
	}

	public void setPassword(String password) {
		this.password = password;
	}
	

	public String getNumber() {
		return number;
	}

	public void setNumber(String number) {
		this.number = number;
	}



	public Integer getPage() {
		return page;
	}

	public void setPage(Integer page) {
		this.page = page;
	}

	public Integer getSize() {
		return size;
	}

	public void setSize(Integer size) {
		this.size = size;
	}

	@Override
	public String toString() {
		return "User [page=" + page + ", size=" + size + ", id=" + id + ", name=" + name + ", password=" + password
				+ ", number=" + number + "]";
	}
}

第三步：编写mapper接口Usermapper
注意：记得添加注解@Mapper

package com.example.demo.mapper;

import java.util.List;

import org.apache.ibatis.annotations.Mapper;

import com.example.demo.entity.User;
@Mapper
public interface UserMapper {
	/**
	 * 通过名字查询
	 * @param name
	 * @return
	 */
	List<User> findUserByName(String name);
	/**
	 * 查询所有用户
	 * @return
	 */
	
	public List<User> ListUser();
	
	/**
	 * 插入一个用户
	 * @param user
	 * @return
	 */
	public int insertUser(User user);
	/**
	 * 根据id删除一条数据
	 * @param id
	 * @return
	 */
	
	public int delete(int id);
	/**
	 * 更新用户
	 * @param user
	 * @return
	 */
	public int Update(User user);
	/**
	 * 分页查询语句，根据sql进行分页
	 * @param page
	 * @param size
	 * @return
	 */
	public List<User> getAllUserByPage(Integer page,Integer size);
	/**
	 * 获取用户总数通过数据库获取
	 * @return
	 */
	public Long getTotal();
	
}

第四步：编写resource中mapper的sql语句
注意：id字段与上一步中接口名必须一致，返回类型需要与你的实体类相匹配

<?xml version = "1.0" encoding = "UTF-8"?>
<!DOCTYPE mapper PUBLIC
        "-//mybatis.org//DTD com.example.Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.example.demo.mapper.UserMapper">
	<resultMap id="result" type="com.example.demo.entity.User">
		<result property="name" column="name" />
		<result property="password" column="password" />
		<result property="number" column="number"/>

	</resultMap>
<!-- 查询所有的角色 -->
	<select id="ListUser" resultMap="result">
		SELECT * FROM user
	</select>
<!-- 通过名字查询所有数据 -->
	<select id="findUserByName" resultMap="result">
		SELECT * FROM user where name=#{name}
	</select>
	<!-- 数据库的分页查询语句。。。有问题-->
	<select id="getAllUserByPage" resultMap="result">
     select
     *
     FROM
     user
     limit #{page}, #{size}
    </select>
    
    <select id="getTotal" resultType="java.lang.Long">
    select count(*) from user
    </select> 



	<!--分特查询的语句    <select id="getAllUserByPage" resultMap="com.example.demo.entity.User.RespPageEntity">
	select * FROM user limit #{page}, #{size}
     </select>
	<select id="getTotal" resultType="com.example.demo.entity.User.RespPageEntity">
		select count(*) from user;
	</select>
	-->
<!-- 插入一条数据 -->
	<insert id="insertUser" parameterType="com.example.demo.entity.User"
		keyProperty="id" useGeneratedKeys="true">
		INSERT INTO user
		(
		id,name,password,number
		)
		VALUES (
		#{id},
		#{name, jdbcType=VARCHAR},
		#{password, jdbcType=VARCHAR},
		#{number}
		)
	</insert>
	<!-- 通过id删除一条数据 -->
	<delete id="delete" parameterType="int">
		delete from user where id=#{id}
	</delete>
	<!-- 增加一个用户 -->
	<update id="Update" parameterType="com.example.demo.entity.User">
	update user set user.name=#{name},user.password=#{password},user.number=#{number} where user.id=#{id}
	</update>
</mapper>

第五步：编写service层（可进行分类接口与实现）

package com.example.demo.service;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

import com.example.demo.entity.RespPageEntity;
import com.example.demo.entity.User;
import com.example.demo.mapper.UserMapper;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;





@Service
public class UserService {
	@Autowired
	private UserMapper userMapper;
    /**
     * 通过名字查询
     * @param name
     * @return
     */
	public List<User> findByName(String name) {
		return userMapper.findUserByName(name);
	}
	
    /**
     * 插入一个用户
     * @param user
     * @return
     */
	public User insertUser(User user) {
		userMapper.insertUser(user);
		return user;
	}
	/**
	 * 查询所有角色
	 * @return
	 */
	public List<User> ListUser(){
		return	userMapper.ListUser();
	}
	
	/**
	 * 更新用户
	 * @param user
	 * @return
	 */
	public int Update(User user){
		return userMapper.Update(user);
	}
	/**
	 * 根据id删除用户
	 * @param id
	 * @return
	 */
	public int delete(int id){
		return userMapper.delete(id);
	}
	
	/**
	 * 分页查询
	 * @param pageNo
	 * @param pageSize
	 * @return
	 */
	public PageInfo<User> getAllUser(int pageNo,int pageSize){
		PageHelper.startPage(pageNo, pageSize);
		List<User> list =userMapper.ListUser();
		//返回一个pageinfo
		PageInfo<User> page=new PageInfo<User>(list);
		return page;
		
	}
	/**
	 * 数据库分页查询
	 * @param page
	 * @param size
	 * @return
	 */
	@Transactional
	public RespPageEntity getALLUserByPage(Integer page,Integer size){
		RespPageEntity pageEntity =new RespPageEntity();
		//默认从0开始
		if(page !=null && size!=null){
			page = (page-1)*size;
		}
		//获取当前用户信息
		List<User> users =userMapper.getAllUserByPage(page, size);
		pageEntity.setDate(users);
		//获取当前用户总量
		Long total=userMapper.getTotal();
		pageEntity.setTotal(total);
		return pageEntity;
		
	}
}

第六步：编写controller中的CRUD(增删查改)
注意：需要一些特定的注解
如：@CrossOrigin 进行跨域访问
@RestController 表示为控制层
@RequestMapping(value = “/CRUD”, method = { RequestMethod.GET, RequestMethod.POST })
向前端的供应的接口（get/post都进行了采用）
@ResponseBody@RequestBody 将User转化为JSON对象
@Autowired 自动注入

package com.example.demo.controller;

import java.util.List;
import javax.naming.spi.DirStateFactory.Result;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;

import com.example.demo.entity.User;
import com.example.demo.service.UserService;

@CrossOrigin
@Configuration
@RestController
@RequestMapping(value = "/CRUD", method = { RequestMethod.GET, RequestMethod.POST })
public class CRUD {
	@RequestMapping("/ListUser")
	@ResponseBody
	@CrossOrigin("http://localhost:8080")
	/**
	 * 查询所有用户
	 * 
	 * @return
	 */
	public List<User> ListUser() {
		return userservice.ListUser();
	}

	@RequestMapping("/ListUserByname")
	@ResponseBody
	@CrossOrigin("http://localhost:8080")
	/**
	 * 根据名字查询
	 * 
	 * @param name
	 * @return
	 * 
	 */
	public List<User> ListUserByname(String name) {
		return userservice.findByName(name);
	}

	@Autowired
	private UserService userservice;

	@RequestMapping(value = "/delete", method = RequestMethod.POST)
	@CrossOrigin("http://localhost:8080")
	/**
	 * 根据id删除
	 * 
	 * @param id
	 * @return
	 */
	public String delete(@RequestBody int id) {
		int result = userservice.delete(id);
		if (result >= 1) {
			return "删除成功";
		} else {
			return "删除失败";
		}
	}

	@RequestMapping(value = "/update", method = RequestMethod.POST)
	@CrossOrigin("http://localhost:8080")
	/**
	 * 更新一个用户
	 * 
	 * @param user
	 * @return
	 */
	public String update(@RequestBody User user) {
		int result = userservice.Update(user);
		if (result >= 1) {
			return "修改成功";
		} else {
			return "修改失败";
		}

	}

	@RequestMapping(value = "/insert", method = RequestMethod.POST)
	@CrossOrigin("http://localhost:8080")
	/**
	 * 插入一个用户
	 * 
	 * @param user
	 * @return
	 */
	public User insert(@RequestBody User user) {
		return userservice.insertUser(user);
	}

	@RequestMapping("into")
	public Result into(@RequestBody User user) {
		User user1 = new User();
		user1.setId(user.getId());
		user1.setName(user.getName());
		user1.setPassword(user.getPassword());
		user1.setNumber(user.getNumber());
		/// return new Result(ResultCode., user);
		// Result rs=new Result(arg0, arg1)
		return null;
	}

	/**
	 * 插入一条新数据
	 * 
	 * @param users
	 */
	@RequestMapping(value = "/insertUser", method = { RequestMethod.POST })
	@ResponseBody
	@CrossOrigin("http://localhost:8080")

	public String insertUser(@RequestBody User users) {
		User rtn = null;
		if (users != null) {
			rtn = userservice.insertUser(users);
		} else {
			System.out.println("没有数据传入");
		}

		if (rtn != null) {
			System.out.println("插入成功");
			System.out.println(rtn.toString());
			return "sucessful";
		} else {
			System.out.println("插入失败");
		}
		return "fail";

	}

	@PostMapping("save")
	public String save(@RequestBody User user) {
		return null;
	}
}

第七步：根据特定的需求编写的过滤器（原理暂时未懂）

Myconfiguration

package com.example.demo.filter;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

@SuppressWarnings("deprecation")
@Configuration
public class MyConfiguration {

    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurerAdapter() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**");
            }
        };
    }
}

webmvcConfig

package com.example.demo.filter;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

/**
 * @Author: zyh
 * @Date: now
 * @Description:
 */
@Configuration
public class WebMvcConfig extends WebMvcConfigurerAdapter {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
                .maxAge(3600)
                .allowCredentials(true);
    }
}

第八步：编写配置文件连接数据库

package com.example.demo.filter;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

/**
 * @Author: zyh
 * @Date: now
 * @Description:
 */
@Configuration
public class WebMvcConfig extends WebMvcConfigurerAdapter {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
                .maxAge(3600)
                .allowCredentials(true);
    }
}

第九步：编写pom文件，添加maven依赖

package com.example.demo.filter;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

/**
 * @Author: zyh
 * @Date: now
 * @Description:
 */
@Configuration
public class WebMvcConfig extends WebMvcConfigurerAdapter {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
                .maxAge(3600)
                .allowCredentials(true);
    }
}

第十步：启动项目SpringbootMybatisApplication

package com.example.demo;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class SpringbootMybatisApplication {

	public static void main(String[] args) {
		SpringApplication.run(SpringbootMybatisApplication.class, args);
	}
}

至此，简单的springboot增删改查的后端基本功能已经实现
顺序可以不一致

总结
1、前端数据删除存在问题，定义的int类型的id根据id来删除数据，删除后后台响应了删除的行列值，但数据库中该数据并未被删除
2、分页查询不能使用分页插件来进行分页(无效接口)，因为前端使用的vue框架，后端应使用数据库的分页查询，但是使用该分页接口后会报错
nested exception is org.apache.ibatis.binding.BindingException: Parameter ‘page’ not found. Available parameters are [arg1, arg0, param1, param2]
推测是由于mybatis中的

<select id="getAllUserByPage" resultMap="result">
 select
 *
 FROM
 user
 limit #{page}, #{size}
</select>

<select id="getTotal" resultType="java.lang.Long">
select count(*) from user
</select>

其中resultMap="result"出现类型不匹配的问题
该问题未解决

使用postman测试
在这里插入图片描述感谢原作者：原博客地址

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^