微信扫码登陆
扫码登陆的官方文档还是很详细的,这边简单记录下
准备工作
于开放平台申请一网站应用,如无开放平台账户先申请开放平台账户。
选择扫码登陆方式
- 非网站内嵌式
重定义网页地址至微信官方扫码登陆地址
let appid = "网站应用的appId";
let redirect_uri = "扫码后的跳转地址";
let state = "state"; // 可使用随机数,详细信息参考官方文档
window.location.href = `https://open.weixin.qq.com/connect/qrconnect?appid=${appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_login&state=${state}#wechat_redirect`;
- 网站内嵌式
<!-- 引入 wxLogin 也可以https引入,实际看自己需求 -->
<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
<!-- 二维码位置Id 设置 -->
<div id="login_container" />
let appid = "网站应用的appId";
let redirect_uri = "扫码后的跳转地址";
let state = "state"; // 可使用随机数,详细信息参考官方文档
var obj = new WxLogin({
self_redirect: true, // true:手机点击确认登录后可以在 iframe 内跳转到 redirect_uri,false:手机点击确认登录后可以在 top window 跳转到 redirect_uri。默认为 false。
id: "login_container",
appid,
scope: "snsapi_login",
redirect_uri,
state,
style: "", // 提供"black"、"white"可选,默认为黑色文字描述。详情参考官方文档
href: "", // 自定义样式链接,第三方可根据实际需求覆盖默认样式。详情参考官方文档
});
Powered by Waline v2.15.8