浏览器获取用户设备信息_微信网页授权 获取用户信息

1.第一步 首先判断是否有code

9e68a279866154766f83ff9ef740e5b7.png

var ua = window.navigator.userAgent.toLowerCase();// ua.indexOf('micromessenger')为真-微信端,如果为假,就是其他浏览器if (ua.indexOf('micromessenger') > -1) {// 判断有没有code 没有就获取codeif (!this.parse_url(window.location.href).code) {var appid = "****"; // 填写你公众号的appidvar redirect_uri = encodeURIComponent(window.location.href);// 获取codewindow.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + appid + "&redirect_uri=" + redirect_uri + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect"
} else {// 如果有code就请求数据获取tokenvar url = window.location.href;var params = this.parse_url(url);
axios({method: 'post',url: '****', // 请求后端协助 写接口返回token给你data:{code: params.code
}
})
.then((res)=>{console.log(res.data.model)// 获取tokenthis.getuserInfo(res.data.model.access_token)
})
}

parse_url(url) { //定义函数var pattern = /(w+)=(w+)/ig; //定义正则表达式var parames = {}; //定义数组
url.replace(pattern, function (a, b, c) {
parames[b] = c;
});return parames; //返回这个数组.
},

2.拿到token去获取信息

bf80b81c50680ab9a2456e663cb7e24a.png

axios({method: 'post',url: '******', // 接口找后端写data:{accessToken: token, (获取的token)openid: '*****'
}
})
.then((res)=>{localStorage.setItem('nickname',res.data.model.nickname)localStorage.setItem('headimgurl',res.data.model.headimgurl)localStorage.setItem('openid',res.data.model.unionid)
})

3.进入你的公众号设置/功能设置/网页域名授权

设置你的域名

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信H5网页授权是指在使用微信浏览器访问H5网页时通过微信授权登录获取用户的基本信息。这个过程分为三个步骤:引导用户授权获取授权码、通过授权获取用户信息。 首先,用户进入H5网页后,网页需要引导用户进行授权登录网页可以通过调用微信JS-SDK中的微信授权接口,弹出微信授权登录的窗口。用户点击确认后,微信会生成一个授权码,并跳转回H5网页。 然后,网页需要使用授权码去微信服务器获取用户的基本信息网页可以通过HTTP请求,将授权码发送给微信服务器的接口,并附上AppID和AppSecret等参数。微信服务器验证授权码的有效性后,会返回用户的基本信息,如openid、昵称、头像等。 最后,网页可以根据获取用户基本信息,进行相应的业务操作。比如显示用户的头像和昵称,或者根据openid等唯一标识,将用户与其它业务系统进行关联。 需要注意的是,进行微信H5网页授权需要先申请微信开放平台的开发者账号,并创建一个公众号或移动应用。通过在微信开放平台进行配置,获取AppID和AppSecret等必要的参数,用于网页授权的流程中。 总结起来,微信H5网页授权获取用户基本信息是通过使用微信授权接口,引导用户进行授权登录,再通过授权码和微信服务器进行交互,最终获取用户的基本信息。这个过程可以实现在H5网页上使用微信账号登录,并获取用户信息的功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值