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实现简单的时钟实例代码
Nov 23 Javascript
Bootstrap开关(switch)控件学习笔记分享
May 30 Javascript
Angularjs使用指令做表单校验的方法
Mar 31 Javascript
AngularJS使用ocLazyLoad实现js延迟加载
Jul 05 Javascript
js图片上传的封装代码
Aug 01 Javascript
jQuery.validate.js表单验证插件的使用代码详解
Oct 22 jQuery
vue-for循环嵌套操作示例
Jan 28 Javascript
实现一个Vue自定义指令懒加载的方法示例
Jun 04 Javascript
基于PHP pthreads实现多线程代码实例
Jun 24 Javascript
Javascript柯里化实现原理及作用解析
Oct 22 Javascript
JavaScript中展开运算符及应用的实例代码
Jan 14 Javascript
微信小程序input抖动问题的修复方法
Mar 03 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
Zerg建筑一览
2020/03/14 星际争霸
php skymvc 一款轻量、简单的php
2011/06/28 PHP
php统计文章排行示例
2014/03/04 PHP
关于Laravel参数验证的一些疑与惑
2019/11/19 PHP
csdn 论坛技术区平均给分功能
2009/11/07 Javascript
js中哈希表的几种用法总结
2014/01/28 Javascript
捕获和分析JavaScript Error的方法
2014/03/25 Javascript
JavaScript自定义数组排序方法
2015/02/12 Javascript
js实现同一页面可多次调用的图片幻灯切换效果
2015/02/28 Javascript
JavaScript实现数字数组按照倒序排列的方法
2015/04/06 Javascript
Jquery中request和request.form和request.querystring的区别
2015/11/26 Javascript
一些实用性较高的js方法
2016/04/19 Javascript
Javascript必知必会(四)js类型转换
2016/06/08 Javascript
表单中单选框添加选项和移除选项
2016/07/04 Javascript
JS实现仿PS的调色板效果完整实例
2016/12/21 Javascript
bootstrap常用组件之头部导航实现代码
2017/04/20 Javascript
AjaxUpLoad.js实现文件上传
2018/03/05 Javascript
NodeJS父进程与子进程资源共享原理与实现方法
2018/03/16 NodeJs
vue导出html、word和pdf的实现代码
2018/07/31 Javascript
微信小程序开发之自定义tabBar的实现
2018/09/06 Javascript
基于Vue-Cli 打包自动生成/抽离相关配置文件的实现方法
2018/12/09 Javascript
零基础之Node.js搭建API服务器的详解
2019/03/08 Javascript
vue中axios实现数据交互与跨域问题
2019/05/12 Javascript
vue的注意规范之v-if 与 v-for 一起使用教程
2019/08/04 Javascript
jQuery实现聊天对话框
2020/02/08 jQuery
js实现磁性吸附的示例
2020/10/26 Javascript
利用一个简单的例子窥探CPython内核的运行机制
2015/03/30 Python
Python实现的数据结构与算法之双端队列详解
2015/04/22 Python
Python argv用法详解
2016/01/08 Python
Python线性拟合实现函数与用法示例
2018/12/13 Python
浅谈Python 参数与变量
2020/06/20 Python
女士时装鞋:Chinese Laundry
2018/08/29 全球购物
俄罗斯香水和化妆品网上商店:NOTINO.ru
2019/12/17 全球购物
Quiksilver美国官网:始于1969年的优质冲浪服和滑雪板外套
2020/04/20 全球购物
项目合作意向书范本
2014/04/01 职场文书
医者仁心观后感
2015/06/17 职场文书