微信小程序登陸

概況描述

後臺使用Spring boot，部分功能須要在小程序上實現。

咱們的後臺是有權限驗證的，因此須要用戶登陸才能調用後端的API。因此，小程序端就須要登陸後端。

本文實現了微信小程序的登陸來完成本身服務器後端的登陸功能。

實現原理

首先，咱們須要登陸小程序，用微信對其受權，而後帶着受權的狀態進行後端的登陸。咱們來看一下微信官方提供給咱們的時序圖：

咱們看到，最開始會調用wx.login以獲取code，而後攜帶獲取的code，去請求後咱們的後端的。

而後，咱們須要在後端，使用獲取的code和小程序的appId以及secret，共同請求微信接口，實現受權，而後微信會返回給咱們openId和session_key。

接着，咱們須要將openId和session_key進行保存，就和咱們原來後端的登陸作法同樣，對登陸的用戶進行session存儲，而後再登陸的時候，去session中請求，看是否存在用戶信息，以達到驗證登陸的目的。

這以後，咱們就能夠帶着登陸的狀態去請求後端的API了。

大體的原理知道了，咱們就去實現一下登陸的過程。

實現

小程序端

首先咱們要知道一點，若是要驗證你是哪一個用戶，就須要微信進行受權。微信給咱們提供了比較方便的解決辦法。

button中有這麼一個屬性：open-type，經過他咱們能夠直接去獲取用戶的微信信息。

<button open-type='getUserInfo' bindgetuserinfo='doLogin'>登陸</button>

將open-type設置爲getUserInfo，而後再使用bindgetuserinfo去觸發登陸的方法，這個函數會返回用戶的信息。

而後，就是調用wx.login()來獲取code。

wx.login({
      success: function(res) {
        console.log(res)
      }
    })

當微信端登陸成功的時候，咱們就會獲取到相應的code，這是用戶的臨時登陸憑證，每次登陸都會不一樣，過一段時間也會失效：

接着帶着code去請求咱們的後端：

wx.login({
      success: function(res) {
        console.log(res)
        
        // 獲取登陸的臨時憑證
        var code = res.code;

        // 調用後臺，獲取session_key,openid
        wx.request({
          url: 'http://localhost:8080/user/wxLogin?code=' + code,
          method: 'POST',  
        })
      }
    })

好了，如今咱們須要一個支撐微信小程序登陸的後臺了。

後端

控制器：

/**
     * 微信登陸
     * @param code  登陸臨時憑證code
     */
    @PostMapping("/wxLogin")
    public voidwxLogin(String code) {
        userService.wxLogin(code);
    }

service:

public void wxLogin(String code) {
        String url = "https://api.weixin.qq.com/sns/jscode2session?" +
                "appid=APPID&" +
                "secret=SERECT&" +
                "js_code=" + code + "&" +
                "grant_type=authorization_code";

        logger.debug("請求微信api，進行登陸受權，獲取session_key和openid");
        String jsonString = restTemplate.getForObject(url, String.class);
        JSONObject jsonObject = JSONObject.parseObject(jsonString);

        logger.debug("獲取openid，進行存儲");
        String openid = jsonObject.get("openid").toString();
        httpSession.setAttribute("openid", openid);
    }

由於這裏，對於同一個用戶而言，openid是相同的，因此，當下次再來請求的時候，咱們只須要獲取它，就能判斷是否登陸了。

後面，對於其餘請求的處理，還須要涉及到攔截器，可是原理和以前同樣，這裏就不作贅述。

---

官方參考：
https://developers.weixin.qq....
https://developers.weixin.qq....
https://developers.weixin.qq....
https://developers.weixin.qq....
https://developers.weixin.qq....