小程序之如何使用微信登录以及获取用户信息

发表于 | 分类于 | 评论数： | 阅读次数：
本文字数： 2.8k | 阅读时长 ≈ 3 分钟

小程序使用微信快速登录

总体流程

  1. 根据微信的官方文档，我们首先需要调用wx.login()接口获取临时登陆凭证code
  2. 然后向后端传送code字段，后端调用auth.code2Session接口获取微信用户的openid和session_key(openid对于小程序用户是唯一的，但是公众号和小程序的openid是不同的，这需要通过unionID来区别用户的唯一性)
  3. 后端对openid和session_key做自己的逻辑处理

获取微信用户信息

  1. 现在的版本在未授权的情况下无法直接调用wx.getUserInfo()来获取微信用户信息，我们需要用一个button来授权，详见文档

    1
    <button open-type="getUserInfo" bindgetuserinfo="getuserinfo">sdsd</button>

  2. 点击按钮的时候将code和userInfo里的信息一同传给后端进行处理

    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
    // 获取微信用户code
    getCode () {
      const promise = new Promise(resolve => {
        wx.login({
          success: (res) => {
            resolve(res)
          }
        })
      })
      return promise
    },

    getuserinfo(res) {
      const userinfo = res.detail.userInfo
      this.getCode().then(res => {
        // console.log(res)
        const code = res.code
        wx.request({
          url: config.api_base_url_local + '/loginbywechat',
          method: 'POST',
          data: {
            id: code,
            faceImage: userinfo.avatarUrl,
            nickname: userinfo.nickName
          },
          success: (res) => {
            console.log(res)
          }
        })
      })
    },

后端对字段进行拼接并调用微信官方接口

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
public JSONResult userRegisterByWechat (@RequestBody Users user) throws Exception {
        // 0.先用传过来的code去请求openid,再把openid作为username存入数据库,前端暂时用id字段来当作code，后面存入数据库会覆盖掉没有影响
        // 1.判断用户名密码不为空
        // 2.用户名是否存在re
        // 3.保存用户
        // 拼接url
        String code = user.getId();
        String url = "https://api.weixin.qq.com/sns/jscode2session?appid=" + appid
                + "&secret=" + appsecret + "&js_code=" + code + "&grant_type=authorization_code";
        // 初始化HttpClient
        CloseableHttpClient httpClient = HttpClients.createDefault();
        // 创建HttpGet
        HttpGet httpGet = new HttpGet(url);
        // 发起请求，获取response对象
        CloseableHttpResponse response = httpClient.execute(httpGet);
        // 关闭httpclient
        httpClient.close();
        // 获取请求状态码
        int status = response.getStatusLine().getStatusCode();
        if (status != 200) {
            return JSONResult.errorMsg("获取微信信息失败，请稍后再试");
        }
        // 获取返回数据实体对象，里面有openid和session_key,对于小程序而言openid是唯一的，session_key用来后段请求用户数据
        HttpEntity entity = response.getEntity();
        // 转为字符串
         String result = EntityUtils.toString(entity,"UTF-8");
         // 解析字符串,将json字符串转为json对象
        JSONObject jsonObject = JSONObject.parseObject(result);
        String openid = jsonObject.getString("openid");
        // session_key暂时没有使用，先注释掉
        // String session_key = jsonObject.getString("session_key")
        // 将openid 当作username
        user.setUsername(openid);
        // password用openid的md5
        user.setPassword(MD5Utils.getMD5Str(user.getUsername()));
        if (StringUtils.isBlank(user.getUsername()) || StringUtils.isBlank(user.getPassword())) {
            return JSONResult.errorMsg("用户名密码不能为空");
        } else if (userService.queryUsernameIsExist(user.getUsername())) {
            return JSONResult.errorMsg(("用户名已存在"));
        } else {
            user.setFansCounts(0);
            user.setReceiveLikeCounts(0);
            user.setFollowCounts(0);
            userService.saveUser(user);
            return JSONResult.ok();
        }

    }
求打赏