小程序登錄和授權

小程序登錄

我們可以在已開啟小程序的時候就完成登錄，也就是可以在app.js 里的onlaunch方法里面寫上小程序登錄。

//微信的登錄方法
wx.login({
      success: res => {
          //登錄成功后會返回一個微信端提供的 code ，用來自定義登錄使用
        console.log("code",res.code);
          //向自己的后台發送請求
        wx.request({
          url: this.globalData.URL+'login/',
          data:{
            code:res.code
          },
          header:{
            "content-type": "application/json"
          },
          method:"POST",
          success:function(e){
            console.log(e)
              //請求成功后會返回一個自己后端生成的 token 用來做其他操作的校驗，把token保存在本地
            wx.setStorageSync("token", e.data.data.token)
          }
        })
        // 發送 res.code 到后台換取 openId, sessionKey, unionId
      }
    })

后端代碼

from rest_framework.views import APIView
from rest_framework.response import Response
from app01.wx import Wx_login
from django.core.cache import cache
from app01 import models
import time
import hashlib

class Login(APIView):
    def post(self,request):
        param = request.data
        if param.get("code"):
            #Wx_login是微信為我們提供的登錄方法，這里的data已經有一個session_key和openid了
            data=Wx_login.login(param.get("code"))
            if data:
                # 1 session_key+時間戳等到一個key.(md5
                md5=hashlib.md5()
                md5.update(data.get("session_key").encode("utf8"))
                md5.update(str(time.time()).encode("utf8"))
                key=md5.hexdigest()

                #2 session_key與openid做綁定等到val
                val=data.get("session_key")+'&'+data.get("openid")

                #3key->val存到redis,
                cache.set(key,val)

                #4把openid存到數據庫
                user_data=models.Wxuser.objects.filter(openid=data.get("openid")).first()
                if not user_data:
                    models.Wxuser.objects.create(openid=data.get("openid"))

                #5把key返回給小程序
                return Response({"code": 200, "msg": "suc","data":{"token":key}})

            else:
                return Response({"code": 202, "msg": "code無效"})
        else:
            return Response({"code":201,"msg":"缺少參數"})

Wx_login

import requests
# appid={}&secret={}&js_code={}
from app01.wx import settings
def login(code):
    #code2Session是wx提供的url，填入你的appid和appsecret以及前端發送來的code
        url=settings.code2Session.format(settings.AppId,settings.AppSecret,code)

    reponse=requests.get(url=url)
    #得到的data里面有session_key和openid。
    data=reponse.json()
    print(data)
    if data.get("session_key"):
        return data
    else:
        return False

settings

#你注冊的小程序的 appid 和 appsecret，code2Session是有官方提供的。pay_mchid是商鋪號，需要工商證才能辦理，所以自己沒法搞。
AppId="wx69a0dca5c6b02a43"

AppSecret="9d0f80642f4861b53df04a2f7bd65a59"

code2Session="https://api.weixin.qq.com/sns/jscode2session?appid={}&secret={}&js_code={}&grant_type=authorization_code"
pay_mchid ='1415981402'
pay_apikey = 'xi34nu5jn7x2uujd8u4jiijd2u5d6j8e'

這樣登錄就完成了

授權

html就是一個按鈕加一個點擊事件，就不寫了，主要看點擊事件做了什么

luying: function () {
    //這個方法的作用是獲取配置，看所有的權限
    wx.getSetting({
        //獲取成功后進入
      success(res) {
        console.log("res", res.authSetting['scope.record'])
          //authSetting是這個權限的列表，這一句是看里面有沒有錄音這個權限
        if (!res.authSetting['scope.record']) {
            //沒有權限的話就會走這一句，這個方法的作用是獲取權限
          wx.authorize({
              //固定寫法權限就是scope.xxx這樣的
            scope: 'scope.record',
            success() {
              // 用戶已經同意小程序使用錄音功能，后續調用 wx.startRecord 接口不會彈窗詢問
              wx.startRecord()
            },
              //在失敗前就已經調用了上面的獲取權限，如果沒有給權限的話，就會走這個方法。
            fail() {
              console.log("你沒有授權")
            }
          })
        } else {
          // wx.startRecord()
        }
      }
    })
  },

獲取用戶信息的權限

因為用戶信息可能會帶一些敏感信息，比如說session_key或者openid等等，在前端想要獲取信息的話，就必須請求權限。

需要注意，這種方式是錯誤的

<button bind:tap="info">用戶信息</button>

必須要這樣寫才行，才行，這樣，在獲取請求的同時，會把一些關鍵的東西傳進點擊事件里。

<button open-type="getUserInfo" bindgetuserinfo="info1">獲取用戶信</button>

js

info1: function (res) {
    console.log(res, "按鈕")
    // wx.getUserInfo({
    //   success: function (res) {
    //     console.log(res, "用戶信息")
    //   }
    // })
    var that = this
    //這個方法是用來看你session_key有沒有過期的
    wx.checkSession({
      success() {
        //session_key 未過期，並且在本生命周期一直有效
        wx.request({
          url: app.globalData.URL + "userinfo/",
          data: {
              //這個東西就是用戶信息了，里面包含敏感信息，是按鈕點擊的時候傳進來的
            encryptedData: res.detail.encryptedData,
              //同上，也是點擊的時候傳進來的
            iv: res.detail.iv,
              //登錄成功后返回的token帶上
            token: wx.getStorageSync("token")
          },
          header: {
            "content-type": "application/json"
          },
          method: "POST",
          success: function (e) {
            console.log(e)

          }
        })
      },
      fail() {
        // session_key 已經失效，需要重新執行登錄流程
        wx.login() //重新登錄
      }
    })
  }