微信小程序开发之——用户登录-登录流程(1)

微信小程序开发之——用户登录-登录流程(1) 2022-08-15 1009

一概述

2.1 index.wxml

<view class="container">
  <view class="userinfo">
      <open-data type="userAvatarUrl"  class="userinfo-avatar"></open-data>
      <open-data type="userNickName"></open-data>
  </view>
</view>

2.2 index.wxss

.userinfo {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #aaa;
}

.userinfo-avatar {
  overflow: hidden;
  width: 128rpx;
  height: 128rpx;
  margin: 20rpx;
  border-radius: 50%;
}

2.3 index.js

Page({})

三小程序登录流程时序

3.1 登录流程时序

3.2 登录中的三个角色

3.3 登录流程说明

3.3.1 小程序获取code

3.3.2 小程序将code发送给开发者服务器

在获取code后，使用wx.request()将code发给开发者服务器

3.3.3 开发者服务器通过微信接口服务校验登录凭证

3.3.4 开发者服务器自定义登录态

登录成功后，开发者服务器将openid和session_key保存，然后生词一个自定义登录态的token(令牌)形影给小程序通过token可以查询到openid和session_key 小程序下次请求，只要携带token，就可以证明用户已登录

3.4 数据缓存

异步方式

方式名称说明异步 wx.setStorage() 将数据存储到本地缓存中指定的key中异步 wx.getStorage() 从本地缓存中获取指定key的内容异步 wx.getStorageInfo() 异步获取当前storage的相关信息异步 wx.removeStorage() 从本地缓存中移除指定key

同步方式

方式名称说明同步 wx.setStorageSync() 将数据存储到本地缓存中指定的key中同步 wx.getStorageSync() 从本地缓存中获取指定key的内容同步 wx.getStorageInfoSync() 获取当前storage的相关信息同步 wx.removeStorageSync() 从本地缓存中移除指定key

四参考源码

免费搭建微信查券返利机器人来轻松赚佣金

文章来自:IT技术分享网
分享地址:http://www.5ityx.cn/cate109/93771.html

上一篇： uniapp开发微信小程序-2.页面制作

下一篇：怎样清除手机上的微信小程序的缓存？