vue 微信扫码登录

1、首先引入wxLogin.js 下载地址:https://download.csdn.net/download/weixin_44037153/88703768

import WxLogin from '../js/wxLogin.js'

2、使用方法
在页面内创建id

引用方法

new WxLogin({
                id: "login_container",
                appid: "wx67cfaf9e3ad31a0d",  // 应用唯一标识,在微信开放平台提交应用审核通过后获得
                scope: "snsapi_login", //应用授权作用域,拥有多个作用域用逗号(,)分隔,网页应用目前仅填写snsapi_login即可
                redirect_uri: "https://sc.wolfcode.cn/cms/wechatUsers/shop/PC", //重定向地址,回调地址,必须使用encodeURLComponent()编码
                state: encodeURIComponent(window.btoa("http://127.0.0.1:8080" + _this.$route.path)), //用于保持请求和回调的状态,授权请求后原样带回给第三方。该参数可用于防止csrf攻击(跨站请求伪造攻击),建议第三方带上该参数,可设置为简单的随机数加session进行校验
                style: 'blank', //提供"black"、"white"可选,默认为黑色文字描述。
                href: 'data:text/css;base64,QGNoYXJzZXQgIlVURi04IjsKLmltcG93ZXJCb3ggLnFyY29kZSB7d2lkdGg6IDE3MHB4OyBib3JkZXI6IG5vbmU7IG1hcmdpbi10b3A6IDB9Ci5pbXBvd2VyQm94IC50aXRsZSB7ZGlzcGxheTogbm9uZTt9Ci5pbXBvd2VyQm94IC5pbmZvIHt3aWR0aDogMTcwcHg7fQouc3RhdHVzX2ljb24ge2Rpc3BsYXk6IG5vbmV9Ci5pbXBvd2VyQm94IC5zdGF0dXMge3RleHQtYWxpZ246IGNlbnRlcjt9IAo=', //自定义样式链接,第三方可根据实际需求覆盖默认样式。  只能使用https链接或者base64编码的地址
            });

注意:href必须使用 text/css模式,生成的base64添加到’data:text/css;base64,'后面就可以了

你可能感兴趣的:(vue.js,微信,前端)