uni-app微信小程序登录授权的实现


Posted in Javascript onMay 22, 2020

微信小程序授权是非常简单和常用的功能,但为了方便,还是在此记录一下要点:

uni-app微信小程序登录授权的实现

首先是需要用到一个授权按钮来触发获取用户信息授权: 关键在于 open-type 为 getUserInfo , 然后有个@getuserinfo的事件,把获取授权接口写到该事件里面去

<button class="sys_btn" open-type="getUserInfo" lang="zh_CN" @getuserinfo="appLoginWx">{{loginInfo.openid != "" && loginInfo.openid != undefined ? "已授权" : "小程序授权"}}</button>

方法如下:

appLoginWx(){
        // #ifdef MP-WEIXIN
          uni.getProvider({
           service: 'oauth',
           success: function (res) {
            if (~res.provider.indexOf('weixin')) {
              uni.login({
                provider: 'weixin',
                success: (res) => {
                  _self.authorization = res.code;
                  uni.getUserInfo({
                    provider: 'weixin',
                    success: (info) => {//这里请求接口
                      console.log(res);
                      console.log(info);
                      
                    },
                    fail: () => {
                      uni.showToast({title:"微信登录授权失败",icon:"none"});
                    }
                  })
              
                },
                fail: () => {
                  uni.showToast({title:"微信登录授权失败",icon:"none"});
                }
              })
              
            }else{
              uni.showToast({
                title: '请先安装微信或升级版本',
                icon:"none"
              });
            }
           }
          });
          //#endif
      }

在 uni.login 和 uni.getUserInfo 被调用后,你可以获取到以下值用于继续请求后端给你的接口:

常用的值大概有:code 、iv 、encryptedData 和 个人基本信息,这些可以传给后端交换得到openid。

uni-app微信小程序登录授权的实现

如果需要知道用户当前是否已经授权,则可以使用如下代码:

uniapp的授权文档,可以判断不同的授权类型:https://uniapp.dcloud.io/api/other/authorize?id=authorize

// #ifdef MP-WEIXIN
      uni.getSetting({
       success(res) {
        console.log("授权:",res);
        if (!res.authSetting['scope.userInfo']) {
          //这里调用授权
          console.log("当前未授权");
        } else {
          //用户已经授权过了
          console.log("当前已授权");
        }
       }
      })
      //#endif

到此这篇关于uni-app微信小程序登录授权的实现的文章就介绍到这了,更多相关uni-app小程序登录授权内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript面象对象设计
Apr 28 Javascript
JS图片浏览组件PhotoLook的公开属性方法介绍和进阶实例代码
Nov 09 Javascript
JS中的public和private对象,即static修饰符
Jan 18 Javascript
JS Pro-深入面向对象的程序设计之继承的详解
May 07 Javascript
原生js实现节日时间倒计时功能
Jan 18 Javascript
Javascript面试经典套路reduce函数查重
Mar 23 Javascript
详解webpack 配合babel 将es6转成es5 超简单实例
May 02 Javascript
jQuery实现简单日期格式化功能示例
Sep 19 jQuery
Vue组件开发之LeanCloud带图形校验码的短信发送功能
Nov 07 Javascript
使用Angular CLI快速创建Angular项目的一些基本概念和写法小结
Apr 22 Javascript
java和js实现的洗牌小程序
Sep 30 Javascript
vue实现计算器功能
Feb 22 Javascript
jQuery 选择器用法实例分析【prev + next】
May 22 #jQuery
jQuery--遍历操作实例小结【后代、同胞及过滤】
May 22 #jQuery
uni-app使用微信小程序云函数的步骤示例
May 22 #Javascript
AutoJs实现刷宝短视频的思路详解
May 22 #Javascript
jquery更改元素属性attr()方法操作示例
May 22 #jQuery
微信小程序转化为uni-app项目的方法示例
May 22 #Javascript
小程序分享链接onShareAppMessage的具体用法
May 22 #Javascript
You might like
在PHP中利用XML技术构造远程服务(上)
2006/10/09 PHP
PHP在Web开发领域的优势
2006/10/09 PHP
php中获取指定IP的物理地址的代码(正则表达式)
2011/06/23 PHP
PHP中SESSION使用中的一点经验总结
2012/03/30 PHP
ThinkPHP模板中判断volist循环的最后一条记录的验证方法
2014/07/01 PHP
PHP中使用Session配合Javascript实现文件上传进度条功能
2014/10/15 PHP
php中current、next与reset函数用法实例
2014/11/17 PHP
php提示Warning:mysql_fetch_array() expects的解决方法
2014/12/16 PHP
PHP自定义函数判断是否为Get、Post及Ajax提交的方法
2017/07/27 PHP
google jQuery 引用文件,jQuery 引用地址集合(jquery 1.2.6至jquery1.5.2)
2011/04/24 Javascript
JQuery文字列表向上滚动的代码
2013/11/13 Javascript
javascript使用正则控制input输入框允许输入的值方法大全
2014/06/19 Javascript
安装使用Mongoose配合Node.js操作MongoDB的基础教程
2016/03/01 Javascript
Bootstrap页面缩小变形的快速解决办法
2017/02/03 Javascript
Bootstrap入门教程一Hello Bootstrap初识
2017/03/02 Javascript
jQuery实现的form转json经典示例
2017/10/10 jQuery
基于vue循环列表时点击跳转页面的方法
2018/08/31 Javascript
vue-cli脚手架的安装教程图解
2018/09/02 Javascript
微信小程序picker组件关于objectArray数据类型的绑定方法
2019/03/13 Javascript
Vue 的双向绑定原理与用法揭秘
2020/05/06 Javascript
js操作两个json数组合并、去重,以及删除某一项元素
2020/09/22 Javascript
vue 图片裁剪上传组件的实现
2020/11/12 Javascript
[01:20]2018DOTA2亚洲邀请赛总决赛战队Mineski晋级之路
2018/04/07 DOTA
[40:27]完美世界DOTA2联赛PWL S3 PXG vs GXR 第一场 12.19
2020/12/24 DOTA
Django框架组成结构、基本概念与文件功能分析
2019/07/30 Python
Django 项目重命名的实现步骤解析
2019/08/14 Python
django admin 添加自定义链接方式
2020/03/11 Python
小 200 行 Python 代码制作一个换脸程序
2020/05/12 Python
详解用Python爬虫获取百度企业信用中企业基本信息
2020/07/02 Python
基于python爬取链家二手房信息代码示例
2020/10/21 Python
关于webview适配H5上传照片或者视频文件的方法
2020/11/04 HTML / CSS
软件测试笔试题
2012/10/25 面试题
机关门卫制度
2014/02/01 职场文书
婚纱摄影师求职信
2014/03/07 职场文书
市场营销专业应届生自荐信
2014/06/19 职场文书
JS创建或填充任意长度数组的小技巧汇总
2021/10/24 Javascript