基于OAuth2.0微信网页第三方授权原理

看了阮一峰的OAuth2.0 的文章,主要偏理论 http://www.ruanyifeng.com/blog/2014/05/oauth_2_0.html
和闪客sun 的,整体流程比较详细 https://www.cnblogs.com/flashsun/p/7424071.html#!comments.
和微信扫码登录OAuth2.0
https://cloud.tencent.com/developer/article/1447723

本人亲自拿gitee登录用微信来登录实验了下:

1.gitee界面找到微信按钮

2.点击微信按钮

①
浏览器发送Get请求:webchat
返回302 URL重定向。
(重定向的流程浏览器首先访问服务器A的URL，服务器A返回带着location为B的URL的 header 和3XX的状态码，浏览器读取响应的3XX状态码，获取到头部的 location，然后跳转到服务器B的URL。需要知道的，跳转是浏览器发起的。)

②
URL重定向到https://open.weixin.qq.com/connect/qrconnect?appid=wx63d402790645b7e6&redirect_uri=https%3A%2F%2Fgitee.com%2Fauth%2Fwechat%2Fcallback&response_type=code&scope=snsapi_login&state=493b424b8d3e54839c606a13862010c200917df6d41a5fe3
返回 200 ok。

参数说明

|参数 |是否必须 |说明|
|:---- |:—|:----- |----- |
|appid |是| 应用唯一标识
|redirect_uri |是| 请使用urlEncode对链接进行处理(与后台配置一致,否则会报redirect_uri参数错误。)
|response_type |是| 填code
|scope |是|应用授权作用域，拥有多个作用域用逗号（,）分隔，网页应用目前仅填写snsapi_login即可
|state |否|用于保持请求和回调的状态，授权请求后原样带回给第三方。该参数可用于防止csrf攻击（跨站请求伪造攻击），建议第三方带上该参数，可设置为简单的随机数加session进行校验
返回说明
用户允许授权后，将会重定向到redirect_uri的网址上，并且带上code和state参数。

3.扫描微信登录成功

扫描微信登录界面成功以后,微信登录界面的JS代码拉起如下Get请求,JS代码如下:

浏览器发送Get请求: https://gitee.com/auth/wechat/callback?code=031Z9gll2xPIx746tlll2NT4VE0Z9gle&state=493b424b8d3e54839c606a13862010c200917df6d41a5fe3
返回200 ok。

返回结果如下图界面所示:(授权成功界面,我这个是微信和gitee没有绑定,也是一种授权成功界面)

**上面是按照步骤来实验,**现在画个图来理解下。

至于很多人有个疑问:为什么要多个code 而不是直接返回token？
安全性:

1.返回code可能会被攻击者挟持。

2.code只能使用一次。换取token需要code,appid,app_secret三个参数。

3.必须确定gitee是在微信授权服务器这边注册过的（一般注册过会发放,appid,app_secret）

微信OAuth2.0授权登录目前支持authorization_code模式，适用于拥有server端的应用授权。该模式整体流程为：

1. 第三方发起微信授权登录请求，微信用户允许授权第三方应用后，微信会拉起应用或重定向到第三方网站，并且带上授权临时票据code参数；

2. 通过code参数加上AppID和AppSecret等，通过API换取access_token；

3. 通过access_token进行接口调用，获取用户基本数据资源或帮助用户实现基本操作。