1. 程式人生 > >前(AngluarJS)後(Java)端分離微信授權

前(AngluarJS)後(Java)端分離微信授權

1、前端請求正常介面,進入攔截器,後臺從Cookie中沒取到值,返回54000給前端。
2、由前端頁面發起授權跳轉(跳轉到微信官方的那個授權介面)。
3、使用者點選同意後,跳轉後臺介面接收code。
4、後端通過code獲取使用者的access_token和openid,然後獲取使用者資訊,進行登入/註冊,將JWT的token存入Cookie。
5、進入前端頁面,再次請求正常介面,因為Cookie中存在值,返回正常資料成功。

1.進入頁面前端使用Ajax傳送請求

2.後臺攔截器攔截請求,先判斷頭部header中是否存在token,如果不存在則判斷Cookie中是否存在token,如果token不為空並符合規則,返回true跳轉真正請求的介面。最後沒取到值判斷介面是否加了註解,沒有返回true結束挑戰真正介面,加了註解返回false結束,response返回54000。

3.前端收到54000響應後,請求微信授權介面,其中redirect_uri為後臺的接收code介面url,引數為前端頁面連結和微信返回code(注意這個redirect_uri要UrlEncode轉碼)。

4.使用者確認授權,微信回撥跳轉redirect_uri,後臺根據code取使用者的access_token和openid,然後獲取使用者資訊,進行插入資料庫,將使用者資訊JWT的token存入cookie,根據引數前端連結跳回前端頁面。

5.進入前端頁面,再次請求正常介面,因為Cookie中存在值,返回正常資料成功。

2018-01-29 補圖