ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

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

2021-04-13 10:01:06  阅读:342  来源: 互联网

标签:openid 登录 微信 access xhr token unionid 授权


既然是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);
    } );

个人博客

标签:openid,登录,微信,access,xhr,token,unionid,授权
来源: https://blog.csdn.net/qq_41980461/article/details/115653871

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有