聊一聊最近的一个项目,这个项目是一个收书、售书的小程序,有商城、专栏、信息发布论坛等功能。虽然不是面向所有用户,但要求无论用户是否授权都皆可使用,但同时也要求部分功能对不授权的用户限制开放。
微信小程序文档这样说
调用 wx.login() 获取 临时登录凭证code ,并回传到开发者服务器。
调用 code2Session 接口,换取 用户唯一标识 OpenID 和 会话密钥 session_key。
之后开发者服务器可以根据用户标识来生成自定义登录态,用于后续业务逻辑中前后端交互时识别用户身份。
也就是说服务器可以返回一个自定义的session,缓存后用于后续业务逻辑中前后端交互时识别用户身份
同时微信小程序文档也说了
1.wx.login 调用时,用户的 session_key 可能会被更新而致使旧 session_key 失效(刷新机制存在最短周期,如果同一个用户短时间内多次调用 wx.login,并非每次调用都导致 session_key 刷新)。开发者应该在明确需要重新登录时才调用 wx.login,及时通过 code2Session 接口更新服务器存储的 session_key。
2.微信不会把 session_key 的有效期告知开发者。我们会根据用户使用小程序的行为对 session_key 进行续期。用户越频繁使用小程序,session_key 有效期越长。
3.开发者在 session_key 失效时,可以通过重新执行登录流程获取有效的 session_key。使用接口 wx.checkSession可以校验 session_key 是否有效,从而避免小程序反复执行登录流程。
当开发者在实现自定义登录态时,可以考虑以 session_key 有效期作为自身登录态有效期,也可以实现自定义的时效性策略。
意思说没必要每次启动小程序都要登录,我这里使用的是每次启动都要登录
onLaunch: function () {
wx.login({
success: res => {
if (res.code) {
// 发送 res.code 到后台换取 openId, sessionKey
}else{
console.log('获取用户登录态失败:' + res.errMsg)
}
}
})
wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
// 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
wx.getUserInfo({
success: res => {
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo
// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
}
}
})
注意: 因为用户授权之后要跳转到用户要使用的功能页面,所以要在重定向之前记录好用户当前的路径信息、要使用的功能的页面的路径信息,存储在globalData中,在获取授权后再重定向至该页面。 如果用户点击拒绝则返回原来页面
贴上部分代码
/**
* oldPath = getApp().globalData.oldPath
* 用户要用的功能页面
* newPath = getApp().globalData.goToPath
*/
const oldPath = getApp().globalData.oldPath
const newPath = getApp().globalData.goToPath
if (app.globalData.userInfo) {
goNewPath(newPath)
} else if (this.data.canIUse) {
// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
if (e.detail.userInfo != void 0){
app.globalData.userInfo = res.userInfo
goNewPath(newPath)
}else{
goOldPath(oldPath)
}
}
} else {
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
if (e.detail.userInfo != void 0){
app.globalData.userInfo = res.userInfo
goNewPath(newPath)
}else{
goOldPath(oldPath)
}
}
})
}
},
bindGetUserInfo: function (e) {
if (e.detail.userInfo != void 0){
app.globalData.userInfo = e.detail.userInfo
wx.switchTab({
url: '../bookcity/bookcity',
success: function (res) { },
fail: function (res) { },
complete: function (res) { },
})
}else{
// 授权失败
goOldPath(oldPath)
}
},
goNewPath: function(path){
// isTab()判断路径是否是Tab
if(isTab(path)){
wx.switchTab({
url: path,
success: function(res) {},
fail: function(res) {},
complete: function(res) {},
})
}else{
wx.reLaunch({
url: path ,
})
}
},
goOldPath: function(path){
wx.navigateBack({
delta: 1,
})
},
isTab: function(path){
}
开发小程序的过程中踩的坑不可谓不多,而有些坑也实在是让人郁闷,不扒一扒难以平我心头之愤呐。
小程序的启动方式:冷启动和热启动,小程序冷启动时,会检查小程序是否有最新版本。如果有则将异步下载最新版本,但是仍将运行当前版本等到下一次冷启动时再运行最新版本。
最近在做小程序开发的时候,发现小程序老是报Do not have xxx handler in current page... 惊不惊喜,意不意外,这是什么原因引起的呢?下面就整排查错误的解决办法。
微信小程序-微信小程序可以通过API获取当前位置的经纬度,在微信小程序开发文档中可以找到这个API的使用示例,但是需要获取具体地址就需要使用到外部的API(此处用到的是腾讯的位置服务)
选择优秀的框架,能帮助我们节省开发时间,提高代码重用性,让开发变得更简单。下面就整理关于微信小程序的前端框架,推荐给大家。
小程序开放至今,许多公司企业已经开发出了自己的小程序。这篇文章主要整理分享:微信小程序UI组件、开发框架、实用库、开发工具、服务端、Demo等
这篇文章主要讲解微信小程序如何实现 侧边栏滑动 功能 ,首先实现的思路为:wxml页面结构分为2层:侧边栏菜单、正文部分;正文部分监听touchstart、touchmove、touchend触摸事件
微信小程序生命周期函数:onLoad: 页面加载。onShow: 页面显示每次打开页面都会调用一次。onReady: 页面初次渲染完成,onHide: 页面隐藏,onUnload: 页面卸载。在小程序中所有页面的路由全部由框架进行管理
三种办法实现小程序的动画效果: 每帧setData()、使用Animation实现旋转效果、使用keyfreams。在wxss中通过控制transform组件的属性,来实现旋转效果,我也是采用的这种方式,性能上面提示非常多
在小程序进行socket链接的时候发现:在1.7.0版本之前,一个微信小程序同时只能有一个 WebSocket 连接,而且在连接socket的时候,发现在还没有进行subscribe的情况下,就直接进行了广播,并且自动关闭了socket连接。
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!