微信公众号登录二维码内嵌到页面

1.将https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js  这个js文件引入到项目中。

在需要微信登录的地方创建以下实例：

new WxLogin({
 self_redirect:true,            //扫码登陆成功之后以什么方式跳转到redirect_uri，true是在id为login_container这个器中直接嵌入iframe打开页面，false是直接跳转到 redirect_uri这个地址。
 id:"login_container",        //用来存放二维码的盒子容器
 appid: "",                  // 应用唯一标识，在微信开放平台提交应用审核通过后获得
 scope: "",                   //应用授权作用域，拥有多个作用域用逗号（,）分隔，网页应用目前仅填写snsapi_login即可
 redirect_uri: "",            //登录成功之后重定向地址，需要进行UrlEncode
  state: "",                  //用于保持请求和回调的状态,可以是一些加密的字符串
 href: ""                     // 修改二维码样式的一些css，需要用base64加密
 });

创建上述实例之后，如果参数都是正确的，会返回一个二维码。

以上就是微信公众号登录二维码内嵌的实现了，下面记录一下在开发中遇到的一个坑：

ps:如果您的业务需要使用微信登录之后才能使用，但是用户登录完成之后可能退出登录，在页面不刷新的前提下用户重新出发登录的时候，您可能会遇到二维码显示不出来的情况。这时候您只需要为显示二维码的盒子提供一个  随机数作为id就可以解决这个问题了。