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

2023-11-20

一 概述

  • 新建微信小程序自带用户登录简化
  • 小程序登录流程时序

二 新建微信小程序自带用户登录简化

新建的微信小程序默认有用户登录功能,将多余功能去除后,简化如下

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({})

2.4 效果图

三 小程序登录流程时序

3.1 登录流程时序

3.2 登录中的三个角色

  • 小程序:用户使用的客户端,由于小程序运行在微信之上,因此小程序可以通过API获取微信用户的身份信息
  • 开发者服务器:小程序的后端服务器,用于为小程序用户提供服务
  • 微信接口服务:微信为开发者服务器提供的接口

3.3 登录流程说明

3.3.1 小程序获取code
  • 在小程序中通过wx.login()获取登录凭证code
  • code由小程序内部自动生成,每次调用wx.login()获得的code都不同
  • code有效期为5分钟,且被微信接口服务验证一次后就会失效
3.3.2 小程序将code发送给开发者服务器
  • 在获取code后,使用wx.request()将code发给开发者服务器
3.3.3 开发者服务器通过微信接口服务校验登录凭证
  • 开发者服务器将AppId、AppSecret、code发给微信接口服务校验登录凭证
  • 如果校验成功,返回session_key和openid等
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

四 参考源码

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

微信小程序开发之——用户登录-登录流程(1) 的相关文章

  • Intel CPU5种不同的CPU频率标定方式

    作者 cici xiang 链接 https www zhihu com question 271509706 answer 364246338 来源 知乎 著作权归作者所有 商业转载请联系作者获得授权 非商业转载请注明出处 Intel C

随机推荐

  • G - Ginger的NB数(二分)

    G Ginger的NB数 SDUT OnlineJudge include
  • pyopencv基础操作指南

    个人学习整理 欢迎指正 实验版本 python版本 3 6 13 opencv版本 2 4 9 1 opencv简介 官网 http docs opencv org 3 0 beta doc py tutorials py tutorial
  • python无法导入自定义类

    问题描述是python3环境 在C Python36 Lib site packages mekk xmind目录下有 init py document py id gen py和xmlutil py四个文件 但是在引入mekk xmind
  • Linux 版本的 SQL Server 快速安装

    SQL Server 2017 版本已经支持 Linux 安装了 出来了很长时间 我还没有实现过在 Linux 上面的应用 包括安装和高可用配置 本文就先尝试完成 Linux 版 SQL Server 的安装 经常在 Windows 下安装
  • VLC for unity 插件如何使用

    VLC for unity 插件如何使用 先去下载一个VLC播放器 安装完成后 然后导入插件链接https download csdn net my 这个插件我的另一个上传资源里有 或者到商店去下载 这个插件链接下载完是一个txt文档 里面
  • settings.json是什么?VS Code的“用户”和“工作区”

    setting json settings json是VS Code众多配置文件中的一个 可以对VS Code进行页面风格 代码格式 字体颜色大小等的编辑设置 比如可能编辑器默认的一个tab为4个空格 用户可以在setting json里面
  • C++11-14 第10讲 template template parameter(模板模板参数)

    template
  • QML类型——ListModel

    正文 列表数据Model 可以自定义格式 详细说明 ListModel是定义ListElement的容器 内容可以动态定义 也可以在QML中明确定义 可以通过count属性获得模型中数据的数量 可以使用模型的setProperty 方法来操
  • 【Linux/C++:modebus通信示例】(带初习配置概括)

    以modbus RTU为例 模拟modbus简单通信原理的代码实现 首先需要配置串口 这里使用的为Configure Virtual Serial Port Driver虚拟串口调试工具 创建COM1 COM2虚拟端口 或另创建一对串口互作
  • JAVA自学之路

    JAVA自学之路 一 学会选择 为了就业 不少同学参加各种各样的培训 决心做软件的 大多数人选的是java 或是 net 也有一些选择了手机 嵌入式 游戏 3G 测试等 那么究竟应该选择什么方向呢 我的意见是 不要太过相信各种培训机构或是抢
  • ctfshow web7

    文章目录 题目分析 解题过程 题目分析 打开题目后 有三个文章 随便点一个之后发现网址上有个后缀 id 2 应该是get传参的注入了 在后缀上加 id 1 1 显示全部文章 可能是整形注入 还是盲注 他这个过滤了空格 用 代替 详见web6
  • MySQL 8.0数据库在Win10的位置

    MySQL 8 0的配置文件位置在下面的ini文件中 C ProgramData MySQL MySQL Server 8 0 my ini C ProgramData 一般是隐藏的 修改文件夹选项可见 或者直接输入位置就能打开文件加了 m
  • wifidog浏览器弹窗认证 — 基于OpenWRT路由器

    一 移植 wifidog功能 1 功能介绍 wifidog是一种能够实现让路由器局域网设备 包括wifi连接和网线连接设备 在上网前先进行 portal认证的工具 主要应用于手机端上网认证 手机在连接wifi后会自动打开浏览器并跳转出 lo
  • C++顺序链表

    include
  • Android AutoCompleteTextView实现自动补全

    辛苦堆砌 转载请注明出处 谢谢 最近工作用到了自动补全 这里做一个简单记录 首先上我们的布局
  • 类函数重载

    函数重载必然发生在同一个作用域 重载函数 本事为不同函数 函数名和参数列表决定函数 函数必须发生在同一个作用域中 include
  • IDEA 编写JDBC 第一个示例

    知心惟有雕梁燕 自来相伴 东风不管琵琶怨 落花吹遍 一 新建一个Module 二 在此Module下新建一个包 在包再建一个包 命名为lib 三 导入mysql驱动 四 将mysql驱动添加到项目的库里 五 代码实现 package Con
  • 协同过滤算法代码

    此算法主要用来推荐的 找出ui uj两个用户同时打过分的课程集合 function getPSet uid ujd select 课程编号 from 评分 where 用户编号 ui and 课程编号 in select 课程编号 from
  • linux使用date命令获取系统时间

    转载自Linux系统date命令的参数及获取时间戳的方法 date指令相关用法示例 date 用法 date OPTION FORMAT date u utc universal MMDDhhmm CC YY ss 直接输入date dat
  • 微信小程序开发之——用户登录-登录流程(1)

    一 概述 新建微信小程序自带用户登录简化 小程序登录流程时序 二 新建微信小程序自带用户登录简化 新建的微信小程序默认有用户登录功能 将多余功能去除后 简化如下 2 1 index wxml