Springboot实现微信小程序注册登录及微信登录_最新基于springboot+mysql+maven实现erp微信小程序授权登录

运行环境

jdk1.8+eclipse+tomact 8.5+maven3.5+springboot 2.0.1 微信开发者工具

数据库

一张表三个字段

CREATE TABLE `user` (
  `uid` varchar(50) NOT NULL,
  `username` varchar(50) NOT NULL,
  `password` varchar(50) NOT NULL,
  PRIMARY KEY (`uid`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
1
2
3
4
5
6

整体目录结构

实现注册代码

@Autowired
	private Userservice userservice;
		
	//用户注册
	@PostMapping("/register")
	public JsonResult register(@RequestBody User user) {
		System.out.println("进来了……");
		System.out.println(user.getUsername());
		//判断用户名和密码不为空
		if(StringUtils.isBlank(user.getUsername()) || StringUtils.isBlank(user.getPassword()) ) {
			return JsonResult.errorMsg("用户名和密码不能为空");
		}
			
		//判断用户名是否存在
		if(!userservice.findUsernameIsExist(user.getUsername())) {
			userservice.saveUser(user);
		}else {
			return JsonResult.errorMsg("用户名已存在，请换一个再试");
		}
		user.setPassword("");//不显示密码	
		return JsonResult.buildData(user);
	}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

实现普通登录代码

//用户登录
	@PostMapping("/login")
	public JsonResult login(@RequestBody User user) {
		String username = user.getUsername();
		String password = user.getPassword();
		
		//判断用户名和密码不为空
		if(StringUtils.isBlank(username) || StringUtils.isBlank(password) ) {
			return JsonResult.errorMsg("用户名和密码不能为空");
		}
			
		//判断用户名是否存在  返回值类型为User
		User userReslut=userservice.queryUserForLogin(username,password);
		if(userReslut != null) {
			userReslut.setPassword("");
			return JsonResult.buildData(userReslut);
		}else {
			return JsonResult.errorMsg("用户名或密码不正确");
		}		
	}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

实现微信登录代码

//微信登录
	@PostMapping("/wxLogin")
	public JsonResult wxLogin(String code) {
		
		System.out.println("code:" + code);	
//		登录凭证校验。通过 wx.login 接口获得临时登录凭证 code 后传到开发者服务器调用此接口完成登录流程
//		请求地址
//		GET https://api.weixin.qq.com/sns/jscode2session?
//				appid=APPID&
//				secret=SECRET&
//				js_code=JSCODE&
//				grant_type=authorization_code
		
		String url = "https://api.weixin.qq.com/sns/jscode2session";
		Map<String, String> param = new HashMap<>();
		param.put("appid", "你的appid");
		param.put("secret", "你的开发者秘钥");
		param.put("js_code", code);
		param.put("grant_type", "authorization_code");
		
		//发起get请求
		String wxResult = HttpClientUtil.doGet(url, param);
		System.out.println(wxResult);
					
		return JsonResult.buildData("微信登录成功");
	}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

小程序端登录界面

小程序端登录js

//普通登录
  doLogin: function (e) {
    var formObject = e.detail.value;
    //console.log(formObject);
    var username = formObject.username;
    var password = formObject.password;
    //简单验证
    if (username.length == 0 || password.length == 0) {
      wx.showToast({
        title: '用户名或密码不能为空',
        icon: 'none',
        duration: 3000
      })
    } else {
      var serverUrl = app.serverUrl;
      wx.request({
        url: serverUrl + '/login',
        method: "POST",
        data: {
          username: username,
          password: password
        },
        header: {
          'content-type': 'application/json' //默认值
        },
        success: function (res) {
          console.log(res.data);
          var status = res.data.status;
          if (status == 200) {
            //登录成功
            wx.showToast({
              title: "登录成功",
              icon: 'success',
              duration: 3000
            })
          } else {
            wx.showToast({
              title: res.data.msg,
              icon: 'none',
              duration: 3000
            })
          }
        }
      })
    }
  },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46

小程序端微信登录js

// 微信登录  
  goWxLogin: function (e) {
    console.log(e.detail.errMsg)
    console.log(e.detail.userInfo)
    console.log(e.detail.rawData)

    wx.login({
      success: function (res) {
        console.log(res)
        // 获取登录的临时凭证
        var code = res.code;
        // 调用后端，获取微信的session_key, secret
        var serverUrl = app.serverUrl;
        wx.request({
          url: serverUrl +"/wxLogin?code=" + code,
          method: "POST",
          success: function (result) {
            console.log(result);
            // 保存用户信息到本地缓存，可以用作小程序端的拦截器
            //app.setGlobalUserInfo(e.detail.userInfo);
            wx.redirectTo({
              url: '../register/register',
            })
          }
        })
      }
    })
  },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

小程序端注册js

//注册
  doRegister: function(e){
    var formObject=e.detail.value;
    console.log(formObject);
    var username = formObject.username;
    var password = formObject.password;
    console.log(username.length);
    //简单验证
    if (username.length == 0 || password.length == 0){
      wx.showToast({
        title: '用户名或密码不能为空',
        icon: 'none',
        duration: 3000
      })
    }else{
      var serverUrl=app.serverUrl;
      wx.request({
        url: serverUrl+'/register',
        method: "POST",
        data: {
          username: username,
          password: password
        },
        header:{
          'content-type': 'application/json' //默认值
        },
        success: function(res){
          console.log(res.data);
          var status=res.data.status;
          if(status == 200){
            wx.showToast({
              title: "注册成功",
              icon: 'none',
              duration: 3000
            })
            wx.redirectTo({
              url: '../login/login',
            })
          }else {
            wx.showToast({
              title: res.data.msg,
              icon: 'none',
              duration: 3000
            })
          }
        }
      })
    }
  },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

到此主要代码结束，功能算是实现了，还有很多需要完善得地方，奥力给 ~

完整代码已上传至github，有需要的小伙伴自取
传送门