本篇教程探讨了微信开发之微信授权登录，希望阅读本篇文章以后大家有所收获，帮助大家对相关内容的理解更加深入。

<

应用场景是：用Hbuilder打包app，在app中点击微信授权登录或者某一操作，调起微信授权登录，用户授权后拿到用户信息。

一、登录插件配置

先配置微信登录参数 appid和appsecret，在manifest.json 文件中选择SDK配置，登录鉴权  勾选微信登录，填入在开放平台申请的app参数。

在manifest.json 文件中选择 源码视图，找到“OAuth”，配置为

"OAuth" : {

"description" : "登录授权"

},

官方相关查阅地址：http://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/192

二、在网站中添加授权登录代码

我的需求是：在网站中点击微信授权登录，判断是否来自wap2app，如果来自wap2app则调起微信授权登录。在网站中加入如下代码：

1.点击微信授权登录，获取微信授权服务：

var auths=null;

$("body").on("click",".loginBtn",function(){

// 微信授权登录

if(navigator.userAgent.indexOf("Html5Plus") > -1){

plus.oauth.getServices( function(services){

auths = services;

authLogin();

}, function(e){

alert("获取分享服务列表失败："+e.message+" - "+e.code);

} );

}

})

2.登录认证

//登录

function authLogin(){

var s = auths[0];

if ( !s.authResult ) {

s.login( function(e){

// 获取登录操作结果

var result = e.target.authResult;

alert( "登录认证成功："+JSON.stringify(result) );

authUserInfo()

}, function(e){

alert("登录认证失败！");

}, {} );

}

}

3.获取用户信息

// 获取登录用户信息操作

function authUserInfo(){

var s = auths[0];

if ( !s.authResult ) {

alert("未登录授权！");

} else {

s.getUserInfo( function(e){

alert( "获取用户信息成功："+JSON.stringify(s.userInfo) );

//拿到用户信息，进行相关处理，ajax传用户数据到服务器等

var prame = JSON.stringify(s.userInfo);

}, function(e){

alert( "获取用户信息失败："+e.message+" - "+e.code );

} );

}

}

4.退出登录

function authLogout(){

for ( var i in auths ) {

var s = auths[i];

if ( s.authResult ) {

s.logout(function(e){

alert( "注销登录认证成功！" );

}, function(e){

alert( "注销登录认证失败！" );

});

}

}

}

官方相关查阅地址：http://www.html5plus.org/doc/zh_cn/oauth.html

在hbuilder中运行会发现可以调起微信授权，且可以获取用户信息，如下图：

点击确认登录后，返回用户信息和unionid等信息，如下图：

但是打包后会一直提示登录认证失败，无法授权，也没有调起微信授权的页面，主要有以下两个错误：

一、报错 code = -2,用户取消

解决办法：研究了很久，发现主要是两个原因：1.使用了网站的appid和appsecret，应该是申请的app应用的appid和appsecret，2.应该使用自有证书

依旧还是报错 code = -2,检查是否在线上运行，即在开放平台绑定的域名必须与该项目的域名一致，即我们常说的，微信分享、微信登录必须在线上测试

二、报错 code = -100如下图：

问题1：检查应用签名是否错误

问题2：检查开放平台的配置授权回调域名是否配置，且是否配置正确(www.baidu.com格式)

解决办法：

微信开放平台移动应用中的应用签名错误，若申请应用时开发信息中数据填写错误，直接修改，已审核通过的不需要重写审核。

应用签名的要求：

1.MD5格式 2.签名为小写；3.去除冒号。都为必须条件。

在Hbuilder中配置时，签名也必须是修改后的格式(md5、小写、去冒号)。

Hbuilder中配置应用签名时，打开manifest.json文件，打开“源码视图”(基础配置，图标配置，启动图配置，SDK配置，模块权限配置中都是没有应用签名配置的，所以很容易遗漏修改它的值)，找到 plus --> signature，修改signature的值为符合条件的值即可

以上打包之后，不在报错，但是还有一个问题，在app中点击微信授权后，除了首次会调起微信授权手动授权的界面，再次授权时直接就弹出了用户信息，即直接执行了，缺少用户在终端确认的请求授权过程

alert( "登录认证成功："+JSON.stringify(result) );

这是因为，授权的微信号只有首次授权时才会调起微信授权的页面，当退出微信授权再次进入时，点击授权会跳转之后再跳回来，自动获取到用户信息。

打包app，微信授权登录常遇到的问题总结：

1.使用了网站的appid和appsecret，应该是申请的app应用的appid和appsecret

2.应该使用自有证书

3.微信开放平台移动应用中的应用签名错误，必须满足3点：1.MD5格式 2.签名为小写；3.去除冒号。都为必须条件。

4.(网站或打包app)微信授权登录，必须在开放平台配置授权回调域名，且必须是www形式的，如www.baidu.com，否则授权登录一直报错

5.开发微信分享、微信登录等微信相关的功能，在开放平台或者公众平台绑定的域名必须与该项目的域名一致，即我们常说的，微信分享、微信登录必须在线上测试

本文由职坐标整理发布，学习更多的相关知识，请关注职坐标IT知识库！