Web 端微信扫码登录

日常使用网站经常会遇到微信扫码登录的场景，这里主要介绍两种 web 端微信扫码登录的方式及主要流程

1. 微信开放平台 —— 网站应用微信登录

接入微信开放平台——网站应用开发实现微信扫码登录

基于 OAuth2.0 协议标准构建的微信 OAuth2.0 授权登录系统。

1.1 前期准备

1. 微信开放平台注册开发者账号
2. 网站已上线，用于在微信开放平台申请网站应用
3. 拥有一个审核通过的网站应用，获取 AppID 和 AppSercret 审核接入流程
4. 申请微信登录且审核通过

1.2 授权流程

1. 第三方发起微信授权登录请求，微信用户允许授权第三方应用后，微信会拉起应用或重定向到第三方网站，并且带上授权临时票据 code 参数；
2. 通过 code 参数加上 AppID 和AppSecret等，通过 API 换取access_token；
3. 通过 access_token 进行接口调用，获取用户基本数据资源或帮助用户实现基本操作。

授权登录时序图

参考文档：https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html

1.3 官网案例

易迅网通过接入网站应用开发，为用户提供了微信登录功能，降低了注册门槛，并可在用户授权后，获取用户基本信息，包括头像、昵称、性别、地区。出于安全考虑，网站应用的微信登录，需通过微信扫描二维码来实现。

官网案例

2. 小程序扫码登录

2.1 前期准备

已发布上线的小程序（获取小程序码接口只能生成已发布的小程序的二维码）

2.2 登录流程

登录流程

2.2.1 生成小程序二维码

开放能力-获取小程序二维码：https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/qr-code.html

ps: 接口只能生成已发布的小程序的二维码

根据场景推荐选择： 接口 B：适用于需要的码数量极多的业务场景

• 生成小程序码，可接受页面参数较短，生成个数不受限。

2.2.2 小程序登录

小程序登录（官方能力）

小程序登录

2.2.3 获取授权状态

可结合业务场景选择合适的方式获取用户授权状态：

• websocket
• 定时轮询

2.3 案例

广东政务服务网微信扫码登录登录案例

广东政务服务网微信扫码登录登录