小程序的本地存储和登录授权

一、小程序的存储
们在开发小程序的时候,常常会用到本地存储,下面我就来给大家分享一下微信本地存储的使用。
一、数据支持
需要存储的内容。只支持原生类型、Date、及能够通过JSON.stringify序列化的对象。

二、方法
1、同步
(1)wx.setStorageSync(); //存储值

(2)wx.removeStorageSync(); // 移除指定的值

(3)wx.getStorageSync(); // 获取值

(4)wx.getStorageInfoSync(); // 获取当前 storage 中所有的 key

(5)wx.clearStorageSync(); // 清除所有的key

2、异步
(1)wx.setStorage(); //存储值
将数据存储在本地缓存中指定的 key 中。会覆盖掉原来该 key 对应的内容。数据存储生命周期跟小程序本身一致,即除用户主动删除或超过一定时间被自动清理,否则数据都一直可用。单个 key 允许存储的最大数据长度为 1MB,所有数据存储上限为 10MB。

(2)wx.removeStorage(); // 移除指定的值

(3)wx.getStorage(); // 获取值

(4)wx.getStorageInfo(); // 获取当前 storage 中所有的 key

(5)wx.clearStorage(); // 清除所有的key

二、小程序的登录授权
思路:

通过wx.login获取code
通过code换取用户的匿名信息,并将获取的token缓存起来
通过调取微信wx.getUserProfile()方法来获取用户详细信息
再调公司后台修改用户的接口(/user/modify),来更新用户信息
最后拉取用户信息,将用户信息渲染到视图上

 第一步:通过wx.login得到code,调用接口获取登录凭证(code)。通过凭证进而换取用户登录态信息
  第二步:通过调用公司后台接口(自动注册/登录接口)获取腾讯用户的匿名信息
  
  //引入接口
const {
     authorize}=require('../../http/api')
  //登录/注册
  goLogin() {
     
   wx.login({
     
    success(res) {
     
      console.log(res);
      let {
     code}=res;
      authorize(code).then(res=>{
     
        console.log('我能获取到信息:',res);
        if(res.code===0) {
     
          //解析出token,uid,但是得到是匿名用户信息
          let {
     token,uid}=res.data
          if(!wx.getStorageSync('token')) {
     

            wx.setStorageSync('token', token)
          }
          
        }
      })
    }
   })

  }
  第三步:获取微信详细的用户信息
  
     获取微信用户详细:
     
        以前:wx.getUserInfo()
        现在:wx.getUserProfile()
        
        token:是用户的唯一标识,是用户(前端)登录之后,后台对用户名,密码和失效时间加密返回给浏览器的一个字符串,用户(前端)可以利用token写其他业务代码
        
        检测token是否有效:调取公司后台接口来检测是否有效 user/check-token
        检测微信登录态是否有效  wx.checkSession()
        
  //检测微信登录状态      
 async function checkSession(){
     
  return new Promise((resolve, reject) => {
     
    wx.checkSession({
     
      success() {
     
        return resolve(true)
      },
      fail() {
     
        return resolve(false)
      }
    })
  })
}
        
// 整体检测微信和token是否失效,返回 true / false
async function checkHasLogined() {
     
  const token = wx.getStorageSync('token')
  if (!token) {
     
    return false
  }
  const loggined = await checkSession()
  if (!loggined) {
     
    wx.removeStorageSync('token')
    return false
  }
  const checkTokenRes = await WXAPI.checkToken(token)
  if (checkTokenRes.code != 0) {
     
    wx.removeStorageSync('token')
    return false
  }
  return true
}

你可能感兴趣的:(小程序的本地存储和登录授权)