如何通过前端在vue中授权登录微信网页第一种登录方式是授权登录，就是在后台提供一个接口，执行直接从前端跳转到新页面，在新页面生成二维码授权登录。这种方式虽然很多公司都在用，但是产品说这种方式的体验不够好，所以采用了下面的授权方式，是第二种微信授权登录方案，可以在当前生成二维码登录page:实现步骤：在vue中，能用轮子就用轮子，所以在npm里找了一个微信登录包vue-wxlogin然后在组件中引入：importwxloginfrom'vue-wxlogin';在组件中使用，可以声明一个对象来保存生成二维码的信息。为了数据安全，我们不能直接在前端页面写生成二维码的信息。我们可以让后端通过接口获取生成二维码的信息，然后通过组件属性属性参数详解属性名类型说明appidString应用程序的唯一标识符。申请在微信开放平台提交审核通过后，获取scopeString申请授权范围，多个scope之间用逗号（,）分隔，web应用目前只需要填写snsapi_login到redirect_uriString重定向地址，UrlEncodestateString需要维护请求和回调的状态，在请求授权后原样发回给第三方。这个参数可以用来防止csrf攻击（跨站请求伪造攻击）。建议第三方带上这个参数，可以设置成简单的随机数加session进行验证。themeString提供了“black”和“white”选项，默认为黑色文字说明。hrefString自定义样式链接，第三方可以根据实际需要覆盖默认样式。需要注意的属性，1.redirect_uri（回调地址）必须是**UrlEncode转码**，这个是个大坑，卡了一个下午2.href（自定义二维码样式链接），必须是一个https链接，它必须有一个证书。如果不使用链接，可以使用data_url方法传递样式。比如：`data:text/css;base64,`+自己的样式内容把它转换成base64再拼接起来。详细可以阅读【自定义微信登录扫码样式解决方案】[2]测试时需要注意：前端项目需要和后台授权返回地址放在同一个域下。最后，有不懂的可以加我wx:czr13692478981
