微信小程序中wx.login和wx.getUserProfile的使用
在使用微信登录时,通常会在调用wx.login获取code后再通过wx.getUserProfile获取iv和encryptedData(加密数据)一起发到后端进行登录验证
在实际使用中如果在wx.login方法调用后再调用再使用wx.getUserProfile会报错
官方解释:

也就是说不能在调用方法的回调中使用wx.getUserProfule()
解决方法:使用Promise.all()方法实现平级调用
Promise.all() 方法接收一个promise的iterable类型(注:Array,Map,Set都属于ES6的iterable类型)的输入,并且只返回一个
Promise实例, 那个输入的所有promise的resolve回调的结果是一个数组。这个Promise的resolve回调执行是在所有输入的promise的resolve回调都结束,或者输入的iterable里没有promise了的时候。它的reject回调执行是,只要任何一个输入的promise的reject回调执行或者输入不合法的promise就会立即抛出错误,并且reject的是第一个抛出的错误信息。
简单点说就是会等到两个方法都回调成功该方法才会返回来值,返回值是一个数组。
上代码
封装wx.login和wx.getUserProfile两个接口

1 /**
2 * 使用promise封装用户信息接口
3 */
4 getUserInfo:function(){
5 return new Promise((resolve,reject) => {
6 wx.getUserProfile({
7 desc: '用户登录', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
8 success: (res) => {
9 resolve(res)
10 },
11 fail:(err) => {
12 reject(err)
13 }
14 })
15 })
16 },
17
18 /**
19 * 使用promise封装wx.login接口
20 */
21 getLogin:function(){
22 return new Promise((resolve,reject) => {
23 wx.login({
24 success (res) {
25 resolve(res)
26 },
27 fail: (err) => {
28 reject(err)
29 }
30 })
31 })
32 },
封装登录接口

1 /**
2 * 登录接口
3 */
4 login: function(){
5 let userRes = this.getUserInfo()
6 let loginRes = this.getLogin()
7 //使用promise.all()平级调用
8 Promise.all([userRes,loginRes])
9 .then((res) => {
10 console.log(res)
11 let param = {
12 code: res[1].code,
13 iv: res[0].iv,
14 encryptedData: res[0].encryptedData
15 }
16 let data = {
17 method: "post",
18 url: api.apiName.wxLogin,
19 params: param
20 }
21 request.request(data)
22 .then(res => {
23 wx.setStorageSync('token', res.data)
24 wx.setStorageSync('hasLogin', true)
25 //获取用户信息
26 let data = {
27 method: "get",
28 url: api.apiName.getUserInfo,
29 params: null
30 }
31 request.request(data)
32 .then(res2 => {
33 wx.hideLoading({})
34 wx.setStorageSync('userInfo', res2.data)
35 })
36 .catch(err => {
37 wx.hideLoading({})
38 console.log(err.msg)
39 })
40 setTimeout(function(){
41 wx.switchTab({
42 url: '../../index/index',
43 })
44 },1500)
45 })
46 .catch(err => {
47 console.log(err.msg)
48 })
49 })
50 }
over over
微信小程序中wx.login和wx.getUserProfile的使用的更多相关文章
- 微信小程序的ajax数据请求wx.request
微信小程序的ajax数据请求,很多同学找不到api在哪个位置,这里单独把小程序的ajax请求给列出来,微信小程序的请求就是wx.request这个api,wx.request(一些对象参数),微信小程 ...
- 微信小程序中用户登录和登录态维护
提供用户登录以及维护用户的登录状态,是一个拥有用户系统的软件应用普遍需要做的事情.像微信这样的一个社交平台,如果做一个小程序应用,我们可能很少会去做一个完全脱离和舍弃连接用户信息的纯工具软件. 让用户 ...
- 全栈开发工程师微信小程序-中(下)
全栈开发工程师微信小程序-中(下) 微信小程序视图层 wxml用于描述页面的结构,wxss用于描述页面的样式,组件用于视图的基本组成单元. // 绑定数据 index.wxml <view> ...
- 微信小程序中的app.js-清除缓存
微信小程序中的app.js 关于小程序app.js生命周期的介绍 App(Object) App() 函数用来注册一个小程序.接受一个 Object 参数,其指定小程序的生命周期回调等. App() ...
- 微信小程序中登录操作-----与-----引用
login.wxml <view> <!-- <image src="./88.png"></image> --> # 在当前目录下 ...
- 网页或微信小程序中使元素占满整个屏幕高度
在项目中经常要用到一个容器元素占满屏幕高度和宽度,然后再在这个容器元素里放置其他元素. 宽度很简单就是width:100% 但是高度呢,我们知道的是height:100%必须是在父元素的高度给定了的情 ...
- 在微信小程序中使用富文本转化插件wxParse
在微信小程序中我们往往需要展示一些丰富的页面内容,包括图片.文本等,基本上要求能够解析常规的HTML最好,由于微信的视图标签和HTML标签不一样,但是也有相对应的关系,因此有人把HTML转换做成了一个 ...
- 全栈开发工程师微信小程序-中(中)
全栈开发工程师微信小程序-中(中) 开放能力 open-data 用于展示微信开放的数据 type 开放数据类型 open-gid 当 type="groupName" 时生效, ...
- 全栈开发工程师微信小程序-中
全栈开发工程师微信小程序-中 多媒体及其他的组件 navigator 页面链接 target 在哪个目标上发生跳转,默认当前小程序,可选值self/miniProgram url 当前小程序内的跳转链 ...
- 微信小程序中的循环遍历问题
比如:如果在微信小程序中要遍历输出 0-9 的数,我们会使用for循环 ;i<;i++){ console.log(i); } 确实结果也是这样: 但是,如果我在循环时同时调用wx的api接口1 ...
随机推荐
- 【分布式】CAP理论及其应用
CAP Theorem CAP 指的就是 "consistency 一致性","availability 可用性" "partition-tolera ...
- Django基础008--model多对多
1.多对多表结构设计 class Student(models.Model): name = models.CharField(verbose_name='学生名字',max_length=100) ...
- C语言:结构体应用
#include <stdio.h> #include <stdlib.h> #include <assert.h> typedef struct student{ ...
- C语言:判断整除
if (aa%10==0)来判断 不能用if (aa/10==int(aa/10)) 判断
- Java基础00-修饰符18
1. 包 1.1 包的概述和使用 通过记事本的方法 package com.itheima;public class HelloWorld { public static void main(Stri ...
- OpenFaaS实战之一:部署
欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...
- Cookie学习总结
Cookie简述 1. 概念 一种客户端会话技术,可以将一些少量的数据保存在客户端. 2. 快速使用 步骤 创建cookie对象,并设定数据 new Cookie(String name, Strin ...
- 简单快速安装Apache+PHP+MySql服务环境(三)—— 下载安装phpmyadmin
为了方便在Linux上操作mysql数据库,打算安装一个phpmyadmin,不过在下载安装的过程中出现了一些坑,特此记录. 1. 在官网上下载phpmyadmin https://files.php ...
- Python urllib翻译笔记一
22.5.urllib- URL处理模块urllib 是一个收集几个模块以处理URL的包: urllib.request 用于打开和阅读URL urllib.error 包含由urllib.reque ...
- 【搜索】单词方阵 luogu-1101
题目描述 给一n×n的字母方阵,内可能蕴含多个"yizhong"单词.单词在方阵中是沿着同一方向连续摆放的.摆放可沿着8个方向的任一方向,同一单词摆放时不再改变方向,单词与单词之间 ...