微信授权登录，uniapp微信授权登录，wap2app微信授权登录，h5plus微信授权登录

本文主要是介绍微信授权登录，uniapp微信授权登录，wap2app微信授权登录，h5plus微信授权登录，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

既然是Dcloud产品，那编译器不约而同使用HBuilderX，并且下面的截图是前提

UniAPP中的微信登陆(APP端)

uni.login({
    provider: 'weixin',
    success: function(loginRes) {
        // uniapp为我们封装了微信登陆，loginRes参数里含有我们需要的openid,unionid,access_token等参数
        let openid = loginRes.authResult.openid;
        let unionid = loginRes.authResult.unionid;
        let access_token = loginRes.authResult.access_token;
		if(unionid){
            // 我们拿到openid、unionid、access_token等参数之后调用后端接口传给后端需要的参数
            // 编写我们的业务逻辑
            // openid,access_token,unionid
		}else{
            // unionid在某些情况下是不存在的【当且仅当该移动应用已获得该用户的 userinfo 授权时，才会出现该字段】(文档中的原话)
            // 所以这里使用原生xhr请求获取unionid
			let xhr = new plus.net.XMLHttpRequest();
            // 传给微信服务器openid和access_token来获取unionid
			xhr.open( "GET", "https://api.weixin.qq.com/sns/userinfo?access_token="+access_token+"&openid="+openid );
			xhr.send();
			xhr.onreadystatechange = function () {
			    if(xhr.readyState == 4 && xhr.status == 200){
				    let res = JSON.parse(xhr.responseText)
					unionid = res.unionid;
                    // 这里我们就可以拿到openid、unionid、access_token等参数
                    // 然后调用后端接口传给后端需要的参数来编写我们的业务逻辑
                    // openid,access_token,unionid
				}else if(xhr.readyState == 4 && xhr.status != 200){
					// console.log( "请求失败："+xhr.readyState );
					uni.showToast({
					    title: '微信登录出错',
					    icon: 'none'
					})
				}
			}
		}
	},
	fail: function() {
	    uni.showToast({
		    title: '微信登录出错',
			icon: 'none'
		})
	}
});

Wap2APP(使用的是H5+API)(APP端)

// 第一步先获取微信服务
plus.oauth.getServices( function(services){
    var wx = null;
    // 遍历所有的服务列表,获取到微信服务
    for(var i = 0;i<services.length;i++){
        if(services[i].id == 'weixin'){
            wx = services[i];
            break;
        }
     }
     // 如果没有微信服务,检查一下前提【manifest.json是否配置】
     if(!wx){
        plus.nativeUI.alert('当前环境不支持微信登陆');
        return false;
     }
     // 第二步获取微信授权
     wx.authorize(function(event){
         // plus.nativeUI.alert("授权成功："+JSON.stringify(event));
         if(!wx.authResult){
             // 第三步微信登录
             wx.login(function(res){
                 // 这里res参数同样包含有后端需要的参数
                 var access_token = res.target.authResult.access_token;
                 var openid = res.target.authResult.openid;
                 var unionid = res.target.authResult.unionid;
                 var data = {
                     openid:openid,
                     access_token:access_token,
                     unionid:unionid
                 }
                 // 但同样有些情况unionid是获取不到的,所以使用原生xhr请求传入access_token和openid获取unionid
                 if(!data.unionid){
                     var xhr = new plus.net.XMLHttpRequest();
                     xhr.open( "GET", "https://api.weixin.qq.com/sns/userinfo?access_token="+access_token+"&openid="+openid );
					 xhr.send();
					 xhr.onreadystatechange = function () {
					     if(xhr.readyState == 4 && xhr.status == 200){
                             let res = JSON.parse(xhr.responseText)
                             data.unionid = res.unionid;
                             // 这里就拿到了unionid
                             // 接下来编写业务逻辑
						 }else if(xhr.readyState == 4 && xhr.status != 200){
							 console.log( "请求失败："+xhr.readyState );
						 }
					 }
                  }else{
                     data.unionid = res.target.authResult.unionid;
                     // 这里拿到了login时候的unionid
                     // 接下来编写业务逻辑
                  }
                }, function(e){
                   plus.nativeUI.alert("登录认证失败:"+JSON.stringify(e));
                } );
            }else{
                plus.nativeUI.alert("已经授权认证!");
            }
        }, function(err){
            plus.nativeUI.alert("授权失败");
        }, {
            scope:'snsapi_userinfo'
        });
    }, function(e){
        plus.nativeUI.alert("获取服务列表失败："+e.message+" - "+e.code);
    } );

个人博客

这篇关于微信授权登录，uniapp微信授权登录，wap2app微信授权登录，h5plus微信授权登录的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！