uniApp实现企业公众号oauth2静默授权登录H5前端部分

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了uniApp实现企业公众号oauth2静默授权登录H5前端部分相关的知识,希望对你有一定的参考价值。

参考技术A appid,服务器域名(域名下的资源文件要能访问,跟后端沟通,先放个html文件进去,比如:www.xxxx.com/h5/index.html 能访问到)

企业H5应用工作台 可信域名配置 找管理员扫码登录 还有 应用主页配置

// 存

function setCookie(key, value)

var initDate = new Date();

initDate.setTime(initDate.getTime() + 30 * 60 * 1000);

document.cookie = key + "=" + value + ";expires=" + initDate.toGMTString() + ";path=/";



// 取

function getCookie(key)

if (document.cookie.length > 0)

var i = document.cookie.indexOf(key + "=")

if (i != -1)

i = i + key.length + 1

var end = document.cookie.indexOf(";", i)

if (end == -1) end = document.cookie.length

return unescape(document.cookie.substring(i, end))





return undefined



//删

function removeCookie(key)

var exp = new Date();

exp.setTime(exp.getTime() - 1);

var val = getCookie(key);

if (val != null)

document.cookie = key + "=" + val + ";expires=" + exp.toGMTString();





export const Cookie =

set: setCookie,

get: getCookie,

remove: removeCookie



import Cookie from "@/utils/cookie.js";

created()

let local = 'http:xxxx.com/index.html'; // 这个是如果没有code需要配合微信重定向获取code的页面,也就是你后端放静态资源文件的路径,一定要可以访问到

if (!Cookie.get("weCode"))

window.location.href =

"https://open.weixin.qq.com/connect/oauth2/authorize?appid=" +

'企业号的appid' +

"&redirect_uri=" + encodeURIComponent(local) +

"&response_type=code&scope=snsapi_userinfo&#wechat_redirect";

else

uni.reLaunch(

url: '/pages/index'

);





import Cookie from "@/utils/cookie.js"

onLaunch: function()

this.getCode()

,

getCode()

let weCode = this.getUrlParam("code"); //查看code是否存在

if (weCode)

Cookie.set("weCode", weCode)

getUserInfo(   // 这个是请求接口把code 给后台,然后后台给你用户的一些信息 getUserInfo不要照抄 这是一个请求方法

code: weCode

).then(res =>

if (res.data.code == 200)

Cookie.set('userId', res.data.data)



)



,

//判断code信息是否存在

getUrlParam(name)

var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");

var r = window.location.search.substr(1).match(reg);

if (r != null)

return unescape(r[2]);



return null;





"pages": [ 



"path": "pages/login/login",

"style":

"navigationBarTitleText": "微信授权",

"navigationStyle": "custom",

"app-plus":

"titleView": false,

"animationType": "none"





,

"path": "pages/index",

"style":

"navigationBarTitleText": "小测试首页",

"navigationStyle": "custom",

"app-plus":

"titleView": false







],

"tabBar":

"list": [

"pagePath": "pages/index",

"iconPath": "static/tabIndexOff.png",

"selectedIconPath": "static/tabIndexOn.png",

"text": "首页"

]

比如 http://www.baidu.com 你就写 baidu.com

比如:http://ms:xxx:7000 端口  你就写  ms:xxx:7000 

记得看微信官方文档!!!

贴出你需要看的链接:

以上是关于uniApp实现企业公众号oauth2静默授权登录H5前端部分的主要内容,如果未能解决你的问题,请参考以下文章

公众号微信第三方登录(静默授权和非静默授权)(具体代码:U盘 新浪云SAE)

微信公众号(静默授权和分享)

微信公众号开发 - 静默授权获取用户信息

.NET Core中 实现H5微信登录(静默授权方式)

微信公众号开发---使用开源组件开发公众号OAuth2.0网页授权授权登录

微信公众平台开发教程_OAuth2.0认证