微信小程序登入流程

微信小程序登入流程

一.首先前端先傳code去後端

wx.login({
      success(res) {
        if (res.code) {
          //發起網絡請求
          wx.request({
            url: app.globalData.host+'login',
            method:"post",
            data: {
              code: res.code
            }
          })
        } else {
          console.log('登陸失敗！' + res.errMsg)
        }
      }
    })

二.後端接受到請求中的code

#.......省略一下配置路由啥的
class Login(APIView):
    def post(self,request):
        code = request.data.get('code')
        print(code,type(code))
        #061HMtlG0hAQ6d2hOYkG0DlhlG0HMtlh <class 'str'>

三.後端得到code以後向微信官方發起請求得到相關參數

發起的連接

GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code

請求參數

屬性	類型	默認值	必填	說明
appid	string		是	小程序 appId
secret	string		是	小程序 appSecret
js_code	string		是	登陸時獲取的 code
grant_type	string		是	受權類型，此處只需填寫 authorization_code

返回值

Object

返回的 JSON 數據包

屬性	類型	說明
openid	string	用戶惟一標識
session_key	string	會話密鑰
unionid	string	用戶在開放平臺的惟一標識符，在知足 UnionID 下發條件的狀況下會返回，詳見 UnionID 機制說明。
errcode	number	錯誤碼
errmsg	string	錯誤信息

errcode 的合法值

值	說明	最低版本
-1	系統繁忙，此時請開發者稍候再試
0	請求成功
40029	code 無效
45011	頻率限制，每一個用戶每分鐘100次

接着上述咱們對於路徑進行拼接成他須要的內容

import requests
class Login(APIView):
    def post(self,request):
        code = request.data.get('code')
    #https: // api.weixin.qq.com / sns / jscode2session?appid = {} & secret ={} & js_code = {} & grant_type = authorization_code
        url= f"https://api.weixin.qq.com/sns/jscode2session?appid=xxxx&secret=xxxx&js_code={code}&grant_type=authorization_code"
        #appid與secret不一樣的開發者不同
        reponse=requests.get(url)
        #由於返回值是json的形式
        data=reponse.json()
        print(data)

appid看你小程序中設置了是哪一個appid

對於的appid有對應的secret

其中appid以及secret均在你小程序帳號中

四.獲取參數後後臺對於參數進行加密處理

import hashlib
class Login(APIView):
    ........
    if data.get("openid") and data.get("session_key"):
        md5 = hashlib.md5()
        md5.update(data['openid'].encode("utf-8"))
        md5.update(data['session_key'].encode("utf-8"))
        key = md5.hexdigest()
        val =data['session_key']+"&"+data['openid']
        print(key,val)

五.若是上述過程都成功,返回前端一個標識方便後續操做

from rest_framework.response import  Response
from django.core.cache import cache

class Login(APIView):
    ........
    cache.set(key,val)  #存緩存中較少對於數據庫的壓力
    has_user=models.Wxuser.objects.filter(openid=data['openid']).first() #將惟一標識進行存儲
    if not  has_user:
        models.Wxuser.objects.create(openid=data['openid'])
        return Response({
            "code": 200,
            "msg": "ok",
            "data":{'login_key':key}  #發送login_key其目的是爲了後續能夠直接去緩存取對於信息
        })

六.前端在前沒有任何問題的狀況下對於標識信息進行接收

目的,標識已登入以及獲取標識,方便後續對於用戶信息的查找

var that = this
    wx.login({
      success(res) {
        if (res.code) {
          //發起網絡請求
          wx.request({
            url: app.globalData.host + 'login',
            method: "post",
            data: {
              code: res.code
            },
            success(res) {
              console.log(res.data.data.login_key)
              console.log(that)
              that.setData({
                login_key: res.data.data.login_key
              }
              )
            },
          })
        }else {
          console.log('登陸失敗！' + res.errMsg)
        }
      }
    })

其中setData方法的必須對象是整個頁面