微信小程序获取手机号及登录

微信小程序获取手机号及登录

---

---

1.获取openid

前端代码如下（示例）：

 wx.login({
      success: res => {
        // 发送 res.code 到后台换取 openId, sessionKey, unionId
        console.log(res.code);
        wx.request({
          url: '你的后端地址',
          method:"POST",
          data:{
            code:res.code
          },
          success:(res)=>{
            console.log(res,"微信登录返回数据");
            console.log(res.data.token);
            if(res.statusCode == 200){
              console.log(res.data.user.user.openid,'openid');
              //将token存在本地
              wx.setStorageSync('token', res.data.token)
              wx.switchTab({
                url: '../office/index'
              })
            }  
          }
        })
      }
    })

后端代码如下（示例）：

@ApiOperation("微信登录")
    @AnonymousPostMapping(value = "/wxlogin")
    public ResponseEntity<Object>wxlogin(@RequestBody Map<Object,Object> code , HttpServletRequest request) throws Exception{
        String c = code.get("code").toString();
        // 这里grant_type的值就是authorization_code固定的
        String jscodeUrl = "https://api.weixin.qq.com/sns/jscode2session?appid=你的appid&secret=你的secret&js_code="+c+"&grant_type=authorization_code";
        Object userInfo = httpClientUtil.sendHttpGet(jscodeUrl);
        System.out.println(userInfo);
        JSONObject jsonObject = JSON.parseObject(userInfo.toString());
        String openid = jsonObject.getString("openid");
        System.out.println(openid);
        UserDto userDto = userService.findByOpenid(openid);
        System.out.println(userDto);
        User user=new User();
        if(userDto == null){
            throw new BadRequestException("请绑定手机号或者联系管理员");
        }
        else{
        //登录完成返回token
            }
            return ResponseEntity.ok(authInfo);
        }

2.获取手机号

前端代码如下（示例）：

// 这个组件免费1000次，超过之后开始收费
		<view>
        <button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">
          微信账号一键登录
        </button>
        </view>
// JS部分
getPhoneNumber(e){
    let detail = e.detail
    console.log(detail);
    if(detail.errMsg === "getPhoneNumber:ok"){
      console.log("用户同意授权");
      let code = detail.code
      console.log(code,"手机号code");
      wx.login({
        success: (res) => {
          console.log(res.code);
          wx.request({
            url: '你的后端地址',
            method:"POST",
            data:{
                phoneCode:code,
                loginCode:res.code 
            },
            success:(res)=>{
            // 在相应手机号已经有了openid之后开始调登录接口
              if(res.statusCode == 200){
                this.wxLogin()
              } 
            }
          })
        },
      })      
    }else{
      console.log("用户拒绝授权");
    }
  }

后端代码如下（示例）：

@ApiOperation("微信手机号登录")
@AnonymousPostMapping(value = "wxLoginNumber")
    public ResponseEntity<Object>wxloginnumber(@RequestBody Map<Object,Object> code) throws Exception{
        Object userInfo = httpClientUtil.sendHttpGet("https://api.weixin.qq.com/sns/jscode2session?appid=你的appid&secret=你的secrect&js_code="+code.get("loginCode").toString()+"&grant_type=authorization_code");
        String openid = JSON.parseObject(userInfo.toString()).getString("openid");
        //        获取access_token
        String accetoken = httpClientUtil.sendHttpGet("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=你的appid&secret=你的secrect");
        //获取手机号
        Map<String,Object> map = new HashMap<>();
        map.put("code",code.get("phoneCode").toString());
        Object phone = httpClientUtil.sendHttpPost("https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token="+JSON.parseObject(accetoken.toString()).getString("access_token"),JSON.toJSONString(map));
        // 获取 phoneNumber 的值
        String phoneNumber = JSON.parseObject(phone.toString()).getJSONObject("phone_info").getString("phoneNumber");
        UserDto userDto = userService.findByPhone(phoneNumber);
        if(userDto ==null){
            throw new BadRequestException("该手机号未注册");
        }else {
        //将openid存在该手机号用户数据下
            User user =  userService.findbyid(userDto.getId());
            user.setOpenid(openid);
            userService.update(user);
            return new ResponseEntity<>(HttpStatus.OK);
        }
    }

---

总结

后端get和post请求用的httpClientUtils,可以自己去了解一下，post请求格式raws注意一下。