php⼩程序登录,⼩程序授权登陆的解决⽅法(附代码)
本篇⽂章给⼤家带来的内容是关于⼩程序授权登陆的解决⽅法(附代码),有⼀定的参考价值,有需要的朋友可以参考⼀下,希望对你有所帮助。
最近在做⼩程序的项⽬,依旧是商城,⼜开始研究的登陆授权坑,第⼀次接触⼩程序,授权登陆也是⼀塌糊涂以后再慢慢的改进
场景
⽤户可以通过搜索进⼊⼩程序
也可以通过别⼈分享进⼊⼩程序
进⼊⼩程序之后需要⽤户授权拿到⽤户信息进⾏注册
代码实现
初始化页⾯home页⽤户第⼀次进⼊⼩程序必须授权后台注册并登陆
app.json{
"pages": [
"pages/home/index",
"pages/login/index",
...
]
}
login.js逻辑进⼊页⾯判断⼀下是不是授权过,判断⽤户是否已经授权,已经授权显⽰登陆,没有授权显⽰授权,⽤户⽆论是注册还是登陆⽤的是后台提供的同⼀个接⼝。返回token存在本地
login.jsconst App = getApp()
import { loginModel } from '../../models/login.js'
import { MineModel } from '../../models/mine.js'
import { encodeUnicode } from '../../utils/index.js'
const ModelLogin = new loginModel()
const Modelmine = new MineModel()
Page({
data: {javascript登录注册界面
logged: !1,
isauth: false,
locked: false
},
onLoad: function(options) {
// 返回到之前要刷新
var pages = getCurrentPages() // 获取页⾯栈
var prevPage = pages[pages.length - 2] // 前⼀个页⾯prevPage.setData({
isBack: true
})
},
onShow: function() {
// 如果已经授权则显⽰登录,直接登录不调⽤授权
Setting().then(res => {
if (res.authSetting['scope.userInfo']) {
this.setData({
isauth: true
})
}
})
//token 不能在page外⾯定义,变量写在 page 外⾯有缓存const token = StorageSync('utoken') // 如果有token显⽰已经授权
this.setData({
logged: !!token
})
token && Back, 1500)
},
login() {
this.wechatSignUp()
},
goBack() {
// 返回登录之前的页⾯
wx.navigateBack({
delta: 1
})
},
// 登陆注册
wechatSignUp(cd) {
// 上锁如果正在请求接⼝那么就返回
if (this.data.locked) {
return
}
this.data.locked = true
//注册或者登陆获取token
let code = ''
App.WxService
.login()
.then(data => {
code = de
wx.setStorageSync('logincode', de)
return UserInfo()
})
.
then(data => {
// 请求后台登录注册接⼝
return ModelLogin.wechatSignUp({
encrypteData: ptedData,
iv: data.iv,
rawData: encodeUnicode(data.rawData), // 编码signature: data.signature,
code: code
})
})
.then(data => {
this.data.locked = false
if (ken == '') {
wx.showToast({
title: '登录失败',
icon: 'none'
})
return
}
App.WxService.setStorageSync('utoken', ken) // 访问后台接⼝获取⽤户信息
App.globalData.userInfo = res.data.userInfo
// 返回上⼀页
})
})
.catch(err => {
this.data.locked = false
console.log(err)
})
}
})
这⾥的App.WxService等价于wx因为wx是回调的⽅式,这⾥使⽤的是promise。
先判断有没有授权,没有授权显⽰点击授权,有授权显⽰点击登录,调⽤的⽅法都是wechatSignUp,拿到wx.login的code和
login的逻辑⼤概就是这些
login.wxml
商城
请同意授权
请登录
为了让头号买⼿可以更好的为您服务
确认授权
确认登录
近期你已经授权登陆过商城
⾃动登录中
访问后台接⼝的时候在header⾥传token如果后台没有拿到token就返回401,前端统⼀拦截跳转到登陆页⾯
结束
关于app.js本来打算在app做拦截的,但是异步请求总是在进⼊页⾯后才拿到后台返回的数据,因为⽤户可能从商品详情页等其他页⾯进⼊⼩程序,授权后要返回进⼊页⾯,在app.js中拦截就⽆法返回页⾯了,所以就直接在页⾯的js⾥去判断,还好可以分享的页⾯不多所以就没有在app.js⾥写任何东西。第⼀次接触,希望以后能优化了再发⽂记录⼀下
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论