小程序登录
我们可以在已开启小程序的时候就完成登录,也就是可以在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() //重新登录
}
})
}
请发表评论