微信扫码登录的实现方式

1、注册微信开放平台账号 

注册地址：https://open.weixin.qq.com/ 进行注册，并且通过企业认证并获取到AppID和AppSecret

微信扫码登录的整体流程

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

官方流程图

2、显示二维码的两种方式

方式一：打开一个新页面 地址如下   

https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect 

参数说明

参数	必填	描述
appid	是	应用唯一标识
redirect_url	是	请使用urlEncode对链接进行处理
response_type	是	填code
scope	是	应用授权作用域，拥有多个作用域用逗号（,）分隔，网页应用目前仅填写snsapi_login即可
state	否	用于保持请求和回调的状态，授权请求后原样带回给第三方。该参数可用于防止csrf攻击（跨站请求伪造攻击），建议第三方带上该参数，可设置为简单的随机数加session进行校验

方式二：当前页面嵌入二维码，引入对应的js文件 用于生成二维码

<script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
var obj = new WxLogin({
                              id:"显示二维码的容器id", 
                              appid: "申请到的appid", 
                              scope: "snsapi_login", 
                              redirect_uri: "这里是回调地址",
                              state: "",
                              style: "black",
                              href: ""
                            });

3、返回说明

用户扫码允许授权后，将会重定向到redirect_uri的网址上，并且带上code和state参数,

redirect_uri?code=CODE&state=STATE

然后需要要通过code获取access_token，请求的地址：https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code

参数说明

参数	是否必须	说明
appid	是	应用唯一标识，在微信开放平台提交应用审核通过后获得
secret	是	应用密钥AppSecret，在微信开放平台提交应用审核通过后获得
code	是	填写第一步获取的code参数
grant_type	是	填authorization_code

接口会返回access_token，最后通过access_token就可以获取到用户的信息
请求地址 https://open.wecard.qq.com/connect/oauth/get-user-info

这样其实就实现了扫码登陆的功能了