import { wxPhoneLogin, getPhoneNumber } from '../login'
// 后端接口
// 服务端接口 - 获取openid
function queryOpenIdFn(code) {
return new Promise((resolve) => {
wxPhoneLogin({
code,
})
.then((res: any) => {
if (res.code == 0) {
console.log('获取openid失败1', res.msg)
return
}
uni.setStorageSync('openId', res.data.openid)
resolve(res.data)
})
.catch((err) => {
console.log('获取openid失败2', err)
})
})
} // 服务端接口 - 获取手机号
function getPhoneNumberFn(phoneCode, openId) {
return new Promise((resolve) => {
getPhoneNumber({
code: phoneCode,
openId,
})
.then((res) => {
if (res.code == 0) {
console.log('获取手机号失败1:', res.msg)
return
}
resolve(res)
})
.catch((err) => {
console.log('获取手机号失败2:', err)
})
})
} // 微信api : 微信登录
function loginFn() {
return new Promise((resolve, reject) => {
uni.login({
success: async (res) => {
queryOpenIdFn(res.code).then((res) => {
resolve(res)
})
},
fail: (err) => {
console.log('login fail:', err)
},
})
})
} export { loginFn, getPhoneNumberFn }

界面调用

 loginFn().then((res: any) => {
// 微信登录&服务端获取openid
console.log(res, '接口换取的openid')
console.log('获取手机号的动态令牌:', e.detail.code) // 动态令牌
getPhoneNumberFn(e.detail.code, res.openid).then((res2: any) => {
// 服务端获取手机号
console.log(555, res2)
if (res2.code == 1) {
userStore.setUserInfs(res2.data?.userinfo)
uni.setStorageSync('token', res2.data.userinfo.token)
gonswi('/pages/index/index')
}
})

})
 

新建 login.ts

微信小程序手机号登录的更多相关文章

  1. SpringCloud微服务实战——搭建企业级开发框架(五十二):第三方登录-微信小程序授权登录流程设计和实现

      在前面的设计和实现中,我们的微服务开发平台通过JustAuth来实现第三方授权登录,通过集成公共组件,着实减少了很多工作量,大多数的第三方登录直接通过配置就可以实现.而在第三方授权登录中,微信小程 ...

  2. php(ThinkPHP)实现微信小程序的登录过程

    源码也在我的github中给出 https://github.com/wulongtao/think-wxminihelper 下面结合thinkPHP框架来实现以下微信小程序的登录流程,这些流程是结 ...

  3. 使用Shiro+JWT完成的微信小程序的登录(含讲解)

    使用Shiro+JWT完成的微信小程序的登录 源码地址https://github.com/Jirath-Liu/shiro-jwt-wx 微信小程序用户登陆,完整流程可参考下面官方地址,本例中是按此 ...

  4. 完整微信小程序授权登录页面教程

    完整微信小程序授权登录页面教程 1.前言 微信官方对getUserInfo接口做了修改,授权窗口无法直接弹出,而取而代之是需要创建一个button,将其open-type属性绑定getUseInfo方 ...

  5. 微信小程序获取登录手机号

    小程序获取登录用户手机号. 因为需要用户主动触发才能发起获取手机号接口,所以该功能不由 API 来调用,需用 <button> 组件的点击来触发. 首先,放置一个 button 按钮,将 ...

  6. uni-app开发经验分享二十: 微信小程序 授权登录 获取详细信息 获取手机号

    授权页面 因为微信小程序提供的 权限弹窗 只能通用户确认授权 所以可以 写一个授权页面,让用户点击 来获取用户相关信息 然后再配合后台就可以完成登录 <button class="bt ...

  7. uni-app 微信小程序授权登录

    1.微信小程序 获取用户信息 与获取手机号 详细信息看官方公告:https://developers.weixin.qq.com/community/develop/doc/000cacfa20ce8 ...

  8. 微信小程序的登录流程

    一.背景 传统的web开发实现登陆功能,一般的做法是输入账号密码.或者输入手机号及短信验证码进行登录 服务端校验用户信息通过之后,下发一个代表登录态的 token 给客户端,以便进行后续的交互,每当t ...

  9. 微信小程序之登录态维护(十一)

    [未经作者本人同意,请勿以任何形式转载] >什么是登录态? 所谓登录态,就是程序在运行时,能够识别当前用户,能够证明自己的唯一性且合法. 我们知道,WEB服务器通过浏览器携带的cookie获取s ...

  10. 微信小程序维护登录态与获取用户信息

    前言. 微信小程序的运行环境不是在浏览器下运行的.所以不能以cookie来维护登录态.下面我就来说说我根据官方给出的方法来写出的维护登录态的方法吧. 一.登录态维护 官方的文档地址:https://m ...

随机推荐

  1. CSS – z-index

    介绍 z-index 是用来设置 element 层次高低的 (当 element 重叠的时候) 参考: 4 reasons your z-index isn't working (and how t ...

  2. 一文搞定WeakHashMap

    写在前面 在缓存场景下,由于内存是有限的,不能缓存所有对象,因此就需要一定的删除机制,淘汰掉一些对象.这个时候可能很快就想到了各种Cache数据过期策略,目前也有一些优秀的包提供了功能丰富的Cache ...

  3. tailwindcss 经验

    树摇时扫描的文件范围 根据 tailwindcss.config.js 中 content 的配置,跟打包软件加载的模块无关.即未使用的模块中的 class 也会被包含进来.

  4. [TK] CF1526B I Hate 1111

    给定一个数,将它表示成若干个形如 \(11,111,1111\cdots\) 之类的数之和,判断有没有可行解 考虑到一种贪心,即从高位开始依次向下减去每位数字,判断还能不能减动,减不动或者没减完就报告 ...

  5. Kubernetes集群安装(十三)

    为了根据最新的集群特性,我们这里安装目前最新的版本 v1.19.3,如果你是在生产环境使用,建议使用上一个版本中最大的修正版本,比如 v1.15.5,由于 v1.16 版本之后和之前的版本有很大变化, ...

  6. SuperMap iManager云套件数据动态更新刷新地图与数据服务

    一.使用背景 有这么一个需求,后端也就通过SuperMap iDesktop或数据库更新了新增或更新某个数据地理信息后,云套件SuperMap iManager中的服务没有更新,无法实时查看到更新的数 ...

  7. C++的并发编程历史

    多线程环境 并非所有的语言都提供了多线程的环境.即便是C++语言,直到C++11标准之前,也是没有多线程支持的. 在这种情况下,Linux/Unix平台下的开发者通常会使用POSIX Threads, ...

  8. CE-植物大战僵尸杂交版

    植物大战僵尸杂交版 偏移:208+82c

  9. 全局和局部混入 mixins

    使用 mixins 混入 的目的 :复用代码,维护代码 : 局部混入: 全局混入 + 按钮权限控制 : ps:定义一个方法 ,checkPermission (str) str 是按钮的权限标识 , ...

  10. 64.element表单校验注意点

    <!-- 表单验证三要素: --> <!-- ① el-form需要有 model属性[表单数据对象].rules属性[验证规则对象].ref属性[引用字符串] --> < ...