wap2app（五）-- 微信受权登陆以及踩过的坑

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

1、登陆插件配置

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

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

"OAuth" : {
    "description" : "登陆受权"
},

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

2、在网站中添加受权登陆代码

个人需求是：在网站中点击微信受权登陆，判断是否来自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等信息，以下图：

可是打包后会一直提示登陆认证失败，没法受权，也没有调起微信受权的页面，主要有如下两个错误：

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

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

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

2、报错 code = -100以下图：

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

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

解决办法：

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

应用签名的要求：

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

在Hbuilder中配置时，签名也必须是修改后的格式（md五、小写、去冒号）。

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.开发微信分享、微信登陆等微信相关的功能，在开放平台或者公众平台绑定的域名必须与该项目的域名一致，即咱们常说的，微信分享、微信登陆必须在线上测试

 转载时请注明出处及相应连接，本文永久地址：http://www.javashuo.com/article/p-pnywvovp-hp.html，文章标题备注转载，如：xxx【转载】,谢谢！