html 微信扫码登录,前端使用微信扫码登录

1、在index.html页面中先引入JS文件：

2、实例化JS对象，在登录的html页面添加一个div：

3、请求接口，获得微信登录的url，如：

https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx48673bc3993cd5d2&redirect_uri=%2F&response_type=code&scope=snsapi_userinfo&state=STATE&connect_redirect=1#wechat_redirect

4、实例化，调用getQueryString()方法获得对应的参数：

let obj = new WxLogin({

id: "login_container", //div的id

appid: this.getQueryString("appid", data),

scope: this.getQueryString("scope", data),

redirect_uri: this.getQueryString("redirect_uri", data), //回调地址

state: this.getQueryString("state", data), //参数，可带可不带

style: "", //样式 提供"black"、"white"可选，默认为黑色文字描述

href: "" //自定义样式链接，第三方可根据实际需求覆盖默认样式。

});

5、getQueryString方法

getQueryString(name,url) {

console.log("url",url)

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

var r = url.substr(url.indexOf("?")).match(reg);

if(r != null) {

return unescape(r[2]);

}

return null;

}