Vue3 - 详解实现网站使用企业微信二维码扫描登录，企业微信授权第三方网站接入企业微信登陆功能，扫二维码登录后获取用户信息，登录页展示企业微信二维码或iframe新开一页或弹框，解决各种报错登录失败

前言

如果您需要 Vue2 版本，请访问 这篇文章。

在 vue3 | nuxt3 网站开发中，详解实现网页集成使用 “企业微信扫一扫登录” 功能，用户使用手机企业微信app扫描网站的登录二维码后，获取用户身份信息及号码并完成授权登录教程，新手小白完整流程及示例运行代码，支持多种企业微信二维码 “展现方式”，可构造独立窗口登录二维码(iframe一个小弹框网页窗口或浏览器新页签全屏展示)、内嵌登录二维码(放到弹框组件中或直接在页面某个dom元素上渲染显示)，完美解决各种二维码渲染失败、常见报错、扫码没反应、无法获取用户数据、本地无法调试等问题。

您直接按教程操作并复制代码运行即可，新手小白轻松搞定改个界面样式即可。

如下图所示，可将二维码放在 “任意位置” 进行展示，或者在网页上弹出一个窗口、新开网页等交互。

详细示例源码及注释说明，保证 100% 无报错接入成功！

准备开始

首先，先来看一下整个登录的流程。