uniapp登录流程详解uni.login

素颜马尾好姑娘i 2021-08-20 02:13 544阅读 0赞

uni.login(OBJECT)登录

H5平台登陆注意事项：

微信内嵌浏览器运行H5版时，可通过js sdk实现微信登陆，需要引入一个单独的js，详见普通浏览器上实现微信登陆，并非开放API，需要向微信申请，仅个别开发者有此权限H5平台的其他登陆，比如QQ登陆、微博登陆，uni-app未封装，请在条件编译里按普通H5写法编写。

OBJECT 参数说明

参数名 类型 必填 说明 平台差异说明provider String 否 登录服务提供商，通过 uni.getProvider 获取，如果不设置则弹出登录列表选择界面  
scopes String/Array 见平台差异说明 授权类型，默认 auth*base。支持 auth*base（静默授权）/ auth*user（主动授权） / auth*zhima（芝麻信用） 支付宝小程序timeout Number 否 超时时间，单位ms 微信小程序、百度小程序success Function 否 接口调用成功的回调  
fail Function 否 接口调用失败的回调函数  
complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行）

success 返回参数说明

参数名 说明authResult 登录服务商提供的登录信息，服务商不同返回的结果不完全相同errMsg 描述信息

uni.login({
      provider: 'weixin',
      success: function (loginRes) {
        console.log(loginRes.authResult);
      }
    });

uni.checkSession检查登录状态是否过期

属性 类型 必填 说明success function 否 接口调用成功的回调函数fail function 否 接口调用失败的回调函数complete function 否 接口调用结束的回调函数（调用成功、失败都会执行）

uni.getUserInfo(OBJECT)获取用户信息。

UNI-APP 开发微信公众号（H5）JSSDK 的使用方式

在 uniapp 中可以使用模块方式引用微信 js-sdk ，微信官网直接下载的使用有问题，可以使用 jweixin-module。

安装

下载使用方式下载地址：https://unpkg.com/jweixin-module@1.4.1/out/index.js

使用、

var jweixin = require('jweixin-module')  
    jweixin.ready(function(){  
        // TODO  
    });

一、小程序:

1、使用 button 组件，并将 open-type 指定为 getUserInfo 类型，获取用户基本信息。

详情参考文档:

https://developers.weixin.qq.com/miniprogram/dev/component/button.html

2、使用 open-data 展示用户基本信息。

详情参考文档:

https://developers.weixin.qq.com/miniprogram/dev/component/open-data.html

provider String 否 登录服务提供商，通过 uni.getProvider 获取  
withCredentials Boolean 否 是否带上登录态信息。 微信小程序、头条小程序lang Number 否 指定返回用户信息的语言，默认为 en。更多值请参考下面的说明。 微信小程序timeout Number 否 超时时间，单位 ms。 微信小程序success Function 否 接口调用成功的回调  
fail Function 否 接口调用失败的回调函数  
complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行）

userInfo 参数说明

参数 类型 说明 平台差异说明nickName String 用户昵称  
openId String 该服务商唯一用户标识 5 AppavatarUrl String 用户头像

uni.login({
      provider: 'weixin',
      success: function (loginRes) {
        console.log(loginRes.authResult);
        // 获取用户信息
        uni.getUserInfo({
          provider: 'weixin',
          success: function (infoRes) {
            console.log('用户昵称为：'   infoRes.userInfo.nickName);
          }
        });
      }
    });

说明：调用 wx.login() 获取 临时登录凭证code ，并回传到开发者服务器。调用 auth.code2Session 接口，换取 用户唯一标识 OpenID 和 会话密钥 session\_key。之后开发者服务器可以根据用户标识来生成自定义登录态，用于后续业务逻辑中前后端交互时识别用户身份。

注意：

会话密钥 session\_key 是对用户数据进行 加密签名 的密钥。为了应用自身的数据安全，开发者服务器不应该把会话密钥下发到小程序，也不应该对外提供这个密钥。临时登录凭证 code 只能使用一次

uni.getProvider(OBJECT)获取服务供应商。仅App平台支持。

在App平台，可用的服务商，是打包环境中配置的服务商，与手机端安装了什么app没有关系。

云打包在manifest中配置相关模块和SDK信息，离线打包在原生工程中配置。某个服务商配置被打包进去，运行时就能得到相应的服务供应商。

关于目前文章内容即涉及前端，PHP知识点，如果有兴趣即可关注，很荣幸，能被您发现，真是慧眼识英！也感谢您的关注，在未来的日子里，希望能够一直默默的支持我，我也会努力写出更多优秀的作品。我们一起成长，从零基础学编程，将 Web前端领域、数据结构与算法、网络原理等通俗易懂的呈现给小伙伴。分享 Web 前端相关的技术文章、工具资源、精选课程、热点资讯。

###  ###

若本号内容有做得不到位的地方（比如：涉及版权或其他问题），请及时联系我们进行整改即可，会在第一时间进行处理。

###  ###

## 请点赞！因为你们的赞同/鼓励是我写作的最大动力！ ##

### 欢迎关注[达达][Link 1]的CSDN！ ###

**这是一个有质量，有态度的博客**

![7d927f18ebd05ea1d505a572393fbc87.jpg][]

[Link 1]: https://blog.csdn.net/qq_36232611
[7d927f18ebd05ea1d505a572393fbc87.jpg]: /images/20210724/ced5bfe9981946e99399e9e313687baa.png