微信授权登录,uniapp微信授权登录,wap2app微信授权登录,h5plus微信授权登录
2021/4/13 10:25:28
本文主要是介绍微信授权登录,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微信授权登录的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-01后台管理开发学习:新手入门指南
- 2024-11-01后台管理系统开发学习:新手入门教程
- 2024-11-01后台开发学习:从入门到实践的简单教程
- 2024-11-01后台综合解决方案学习:从入门到初级实战教程
- 2024-11-01接口模块封装学习入门教程
- 2024-11-01请求动作封装学习:新手入门教程
- 2024-11-01登录鉴权入门:新手必读指南
- 2024-11-01动态面包屑入门:轻松掌握导航设计技巧
- 2024-11-01动态权限入门:新手必读指南
- 2024-11-01动态主题处理入门:新手必读指南