当前位置: 首页 > news >正文

随手记:uniapp小程序登录方式和小程序使用验证码登录

小程序登录方式:


方式一:小程序授权登录
通过uni.login获取 临时登录凭证code,向后端换取token。

<u-button type="primary" shape="circle" @click="login">登 录</u-button>login() {uni.login({provider: 'weixin',success: loginRes => {console.log('loginRes', loginRes);//使用获取到的loginRes.code调用后端的登录接口}});
}


方式二:手机号授权登录
通过button按钮的设置open-type=“getPhoneNumber”事件,弹出手机号授权+调用 uni.login() 获取 临时登录凭证code,向后端换取token。会弹出用户确认弹窗

<u-button type="primary" shape="circle" @click="login" open-type="getPhoneNumber"  @getphonenumber="getPhoneNumber">登 录</u-button>getPhoneNumber(e) {if (!e.detail.hasOwnProperty("encryptedData")) { // 没有encryptedData代表用户拒绝授权return}// 授权登录获取用户codeuni.login({provider: 'weixin',success: loginRes => {console.log(loginRes);this.miniProgramCode = loginRes.code;console.log(e)uni.showLoading({mask: true,title: '授权登录中'})// 调接口传递给后端参数获取手机号码-完成授权并做页面跳转wxMiniProgramLogin({jsCode: this.miniProgramCode,code: e.detail.code,hospitalId: getApp().globalData.hospitalId || ''}).then(res => {console.log(res)uni.hideLoading();uni.setStorageSync('_USER_OPENID', res.data.openid);this.settingToken(res.data.token);this.getUserInfo().then(response => {let url = '';this.initIm();uni.showToast({ title: '登录成功', icon: 'none'});url = '/pages/index/main'setTimeout(() => { uni.switchTab({ url }) }, 500);})})}});},


方式三:用户信息授权登录
通过 uni.getUserProfile() 获取用户信息+调用 uni.login() 获取 临时登录凭证code,获取到用户加密数据后,向后端换取token

<u-button type="primary" shape="circle" @click="login" >登 录</u-button>login() {uni.getUserProfile({desc: '完善用户信息',success:userRes => {console.log('userRes', userRes);//拿到所需要的参数调用后端接口}})
}

小程序验证+验证码登录:


流程思路:
用户进入页面 > 输入手机号 > 点击获取验证码 > 输入验证码 > 点击登录时调用uni.login获取code,code获得后把 (code,手机号,验证码,若还有其他参数)这些参数传给登录接口 > 登录成功后端返回token openid > 前端把token openid缓存下来 > 登录完成 >跳转页面(首页或者指定页面)

代码后续更新...

相关文章:

随手记:uniapp小程序登录方式和小程序使用验证码登录

小程序登录方式&#xff1a; 方式一&#xff1a;小程序授权登录 通过uni.login获取 临时登录凭证code&#xff0c;向后端换取token。 <u-button type"primary" shape"circle" click"login">登 录</u-button>login() {uni.login({p…...

【Hadoop|HDFS篇】DataNode概述

1. DataNode的工作机制 1&#xff09;一个数据块在DataNode上以文件形式存储在磁盘上&#xff0c;包括两个文件&#xff0c;一个是数据本身&#xff0c;一个是元数据包括数据块的长度&#xff0c;块数据的校验和&#xff0c;以及时间戳。 2&#xff09;DataNode启动后向NameNod…...

Vue2 VueRouter学习笔记

VueRouter 官方文档 版本对应 vue2&#xff1a;3.x.x vue3&#xff1a;4.x.x 路由&#xff1a;访问路径与vue组件&#xff08;页面&#xff09;之间的映射关系 VueRouter&#xff1a;Vue官方提供的插件&#xff0c;本质上是一个 JavaScript 库&#xff0c;用于在 Vue.js 应用…...

3D培训大师,化工企业安全教育与应急演练的新助力

化工企业的生产安全培训&#xff0c;作为保障员工生命安全与企业稳定运营的基石&#xff0c;其重要性不言而喻。传统的培训方式内容僵化、形式单一缺乏互动、效果难以评估&#xff0c;越来越不适应化工企业的实际需求。因此&#xff0c;探索和应用更为高效、创新的培训工具&…...

斯坦福大学论文润色chat-gpt指令

Quick Prompts快速提示 To enhance text clarity-为了增强文本清晰度 As a non-native English speaker, kindly help me revise the following text for improved understand clarity. Please check for spelling and sentence structure errors and suggest alternatives.为…...

简单硬件在环搭建(ROS+Prescan+Carsim+simulink)

本文通过ROSPrescanCarsimsimulink搭建简单的硬件在环仿真测试平台。 系统架构如下&#xff1a; 在Windows中运行prescan场景仿真软件&#xff0c;在jetson Nano中运行ROS&#xff0c;硬件上两台电脑通过一根网线相连传输信息&#xff1b; 1.prescan与carsim的集成 在C:\car…...

【Python 数据分析学习】Pandas基础与应用(1)

题目 1 Pandas 简介1.1 主要特征1.2 Pandas 安装 2 Pandas中的数据结构2.1 Series 数据结构和操作2.1.1 Series的数据结构2.1.2 Seres的操作 2.2 DataFrame 数据结构和操作2.2.1 DataFrame 数据结构2.2.2 Dataframe 操作2.2.3 DateFrame 的特殊操作 2.3 Series 和 DataFrame 的…...

pytorch入门(1)——pytorch加载数据初认识

环境配置及其安装&#xff1a; 2023最新pytorch安装&#xff08;超详细版&#xff09;-CSDN博客 pytorch加载数据初认识 Dataset&#xff1a;创建可被Pytorch使用的数据集 提供一种方式获取数据及其label Dataloader&#xff1a;向模型传递数据 为网络提供不同的数据形式 …...

Spring下载文件

1、controller /*** 下载文件通过ID** param auditInformationDTO 靓号稽核文件DTO* param servletResponse 响应体*/ GetMapping(value "/downloadAuditFileByAuditFileId") public void downloadAuditFileByAuditFileId(ModelAttribute final GoodNumberAuditInf…...

如何在数据库中备份表:操作指南与注意事项

在数据库管理中&#xff0c;备份表是一种常见的操作&#xff0c;它可以帮助我们保存数据的当前状态&#xff0c;以便在需要时进行恢复或分析。备份表可以通过创建一个新表并复制原表的所有数据到新表中来实现。 以下是具体的SQL语句&#xff1a; CREATE TABLE backup_table A…...

【数据结构】第八节:链式二叉树

个人主页&#xff1a; NiKo 数据结构专栏&#xff1a; 数据结构与算法 源码获取&#xff1a;Gitee——数据结构 一、二叉树的链式结构 typedef int BTDataType; typedef struct BinaryTreeNode {BTDataType data;struct BinaryTreeNode* left; // 左子树根节点struct BinaryT…...

Fair Graph RepresentationLearning via Diverse Mixture-of-Experts

发表于&#xff1a;WWW23 推荐指数&#xff1a; #paper/⭐⭐ 问题背景&#xff1a; 背景 现实世界的数据很多样&#xff0c;阻止GNN学习公平的表示。当去偏见化后&#xff0c;他们面临着可学知识不足且属性有限的重大问题 解决方法&#xff1a; 应对公平训练导致可学习知识…...

电机驱动开发之驱动板

目录 1.主要器件选型2.原理图设计3.PCB绘制电源调理驱动电路电流反馈位置反馈 4.PCB绘制5.打板验证6.总结 1.主要器件选型 器件参数封装理由LDOLM317DCYR &#xff08;24V-12V 12V-5V&#xff09;SOT-223小电流应用 LDO比DCDC噪声小响应快更为稳定预驱FD6288TTssop-20常见无刷…...

STM32F1 HAL库笔记2_HAL 系统驱动程序

1、HAL 固件驱动程序 API 1.1、如何使用此驱动程序 通用 HAL 驱动程序包含一组通用的 API&#xff0c;PPP 外设驱动程序可以使用这些 API 来开始使用 HAL。HAL 包含两个 API 类别&#xff1a; • 常见的 HAL API • 服务 HAL API 1.2、初始化和去初始化函数 本节提供的功能&a…...

el-table实现当内容过多时,el-table显示滚动条,页面不显示滚动条

估计有不少小伙伴在开发公司的ERP使用el-table都会遇到这么一个问题&#xff0c;就是产品经理提出&#xff0c;页面不出现滚动条&#xff0c;因为不美观。但是当el-table内容过多&#xff0c;超过页面的宽度时候&#xff0c;页面就会有滚动条。那应该如何解决呢?能不能让滚动条…...

Java面试篇基础部分-Java中的异常以及异常处理

导语   在实际的开发过程中,往往会遇到各种各样的编程异常,如何处理这些异常,直接会影响到整个程序和系统的稳定性,如果不能在合适的地方抛出合适的异常或者是对异常进行捕获。那么就会影响到整个程序的运行。所以如何处理异常,是作为每个开发者来说必不可少的开发技能。…...

win11 MySQL的坑

最近升级了系统&#xff0c;导致以前的安装的两个版本MySQL服务无法启动&#xff0c;只能在mysql的bin目录&#xff0c;执行mysqld --console才能启动&#xff0c;mysqld都无法启动&#xff0c; 所幸进行了数据库初始化&#xff0c;这次在MySQL的bin目录执行 mysqld或者mysqld …...

stm32单片机个人学习笔记1(简单介绍)

前言 本篇文章属于stm32单片机&#xff08;以下简称单片机&#xff09;的学习笔记&#xff0c;来源于B站教学视频。下面是这位up主的视频链接。本文为个人学习笔记&#xff0c;只能做参考&#xff0c;细节方面建议观看视频&#xff0c;肯定受益匪浅。 STM32入门教程-2023版 细…...

python中@staticmethod、@classmethod用法

1、类的基础介绍 类对象&#xff1a;定义的类就是类对象 类属性&#xff1a;定义在__init__ 外部的变量 类方法&#xff1a;定义在类中&#xff0c;且被classmethod 装饰的方法 实例对象&#xff1a;类对象实例化后就是实例对象 实例属性&#xff1a;定义在__init__内部带…...

Harmony Next 文件命令操作(发送、读取、媒体文件查询)

查询文件位置 hdc shell mediatool query IMG_20240902_204224.jpg 输出示例 拉取文件 hdc file recv /storage/cloud/100/files/Photo/4/IMG_1725281044_036.jpg aa.jpg 发送文件 hdc file send aa.jpg /storage/media/100/local/files/Docs/Download/ab.jpg 下载目录位置…...

网络编程(Modbus进阶)

思维导图 Modbus RTU&#xff08;先学一点理论&#xff09; 概念 Modbus RTU 是工业自动化领域 最广泛应用的串行通信协议&#xff0c;由 Modicon 公司&#xff08;现施耐德电气&#xff09;于 1979 年推出。它以 高效率、强健性、易实现的特点成为工业控制系统的通信标准。 包…...

Flask RESTful 示例

目录 1. 环境准备2. 安装依赖3. 修改main.py4. 运行应用5. API使用示例获取所有任务获取单个任务创建新任务更新任务删除任务 中文乱码问题&#xff1a; 下面创建一个简单的Flask RESTful API示例。首先&#xff0c;我们需要创建环境&#xff0c;安装必要的依赖&#xff0c;然后…...

MySQL 隔离级别:脏读、幻读及不可重复读的原理与示例

一、MySQL 隔离级别 MySQL 提供了四种隔离级别,用于控制事务之间的并发访问以及数据的可见性,不同隔离级别对脏读、幻读、不可重复读这几种并发数据问题有着不同的处理方式,具体如下: 隔离级别脏读不可重复读幻读性能特点及锁机制读未提交(READ UNCOMMITTED)允许出现允许…...

蓝桥杯 2024 15届国赛 A组 儿童节快乐

P10576 [蓝桥杯 2024 国 A] 儿童节快乐 题目描述 五彩斑斓的气球在蓝天下悠然飘荡&#xff0c;轻快的音乐在耳边持续回荡&#xff0c;小朋友们手牵着手一同畅快欢笑。在这样一片安乐祥和的氛围下&#xff0c;六一来了。 今天是六一儿童节&#xff0c;小蓝老师为了让大家在节…...

数据链路层的主要功能是什么

数据链路层&#xff08;OSI模型第2层&#xff09;的核心功能是在相邻网络节点&#xff08;如交换机、主机&#xff09;间提供可靠的数据帧传输服务&#xff0c;主要职责包括&#xff1a; &#x1f511; 核心功能详解&#xff1a; 帧封装与解封装 封装&#xff1a; 将网络层下发…...

04-初识css

一、css样式引入 1.1.内部样式 <div style"width: 100px;"></div>1.2.外部样式 1.2.1.外部样式1 <style>.aa {width: 100px;} </style> <div class"aa"></div>1.2.2.外部样式2 <!-- rel内表面引入的是style样…...

《基于Apache Flink的流处理》笔记

思维导图 1-3 章 4-7章 8-11 章 参考资料 源码&#xff1a; https://github.com/streaming-with-flink 博客 https://flink.apache.org/bloghttps://www.ververica.com/blog 聚会及会议 https://flink-forward.orghttps://www.meetup.com/topics/apache-flink https://n…...

多模态大语言模型arxiv论文略读(108)

CROME: Cross-Modal Adapters for Efficient Multimodal LLM ➡️ 论文标题&#xff1a;CROME: Cross-Modal Adapters for Efficient Multimodal LLM ➡️ 论文作者&#xff1a;Sayna Ebrahimi, Sercan O. Arik, Tejas Nama, Tomas Pfister ➡️ 研究机构: Google Cloud AI Re…...

DeepSeek 技术赋能无人农场协同作业:用 AI 重构农田管理 “神经网”

目录 一、引言二、DeepSeek 技术大揭秘2.1 核心架构解析2.2 关键技术剖析 三、智能农业无人农场协同作业现状3.1 发展现状概述3.2 协同作业模式介绍 四、DeepSeek 的 “农场奇妙游”4.1 数据处理与分析4.2 作物生长监测与预测4.3 病虫害防治4.4 农机协同作业调度 五、实际案例大…...

力扣-35.搜索插入位置

题目描述 给定一个排序数组和一个目标值&#xff0c;在数组中找到目标值&#xff0c;并返回其索引。如果目标值不存在于数组中&#xff0c;返回它将会被按顺序插入的位置。 请必须使用时间复杂度为 O(log n) 的算法。 class Solution {public int searchInsert(int[] nums, …...