<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>复制代码
二、实例化JS对象,在登陆的html页面添加一个div:
html
<div className={styles.login_container} id="login_container"></div>复制代码
三、请求接口,得到微信登陆的url,如:api
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复制代码
四、实例化,调用getQueryString()方法得到对应的参数:
bash
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: "" //自定义样式连接,第三方可根据实际需求覆盖默认样式。 });复制代码
五、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; }复制代码