sau交流學習社群第三方登陸github--oauth來實現使用者登入

saucxs發表於2018-11-13

sau交流學習社群第三方登陸github--oauth來實現使用者登入

最近在豐富nodejsBlog開發的“交流學習社群”(www.mwcxs.top)的其他功能以及修復一些bug。

有時候覺得註冊會讓使用者覺得很麻煩,如果提供第三方登陸,使用者會選擇他經常使用的平臺進行登陸,這樣可以省去很多繁瑣的步驟,開發人員基本都會有Github賬號。

在考慮使用第三方登入,就研究了下使用github的oauth來時間使用者登入。實現起來還是很簡單的,下面簡單介紹一下:

一、OAuth 2.0原理

為啥要說下這個oauth 2.0的原理?因為這個是第三方登陸必須要理解的地方。

OAuth(開放授權)是一個開放標準,允許使用者讓第三方應用訪問該使用者在某一網站上儲存的私密的資源(如照片,視訊,聯絡人列表),而無需將使用者名稱和密碼提供給第三方應用。 ---- 百度百科

(一)該協議和授權認證中涉及三個部分:

1、服務端提供方,例如github,QQ等,github上儲存了使用者的登入名,email,暱稱,頭像等資訊

2、使用者

3、客戶端,例如交流學習社群就是一個客戶端,需要服務端向我提供一些基本資訊

(二)認證授權過程

1、交流學習社群需要通過github獲取使用者的基本資訊

2、跳轉到github的授權頁面,使用者同意交流學習社群獲取它的基本資訊

3、交流學習社群獲取github提供的授權碼(驗證碼),使用授權碼向github申請一個令牌

4、github對交流學習社群提供的授權碼進行驗證,驗證沒有問題後,給一個令牌到交流學習社群端

5、交流學習社群使用令牌,向github獲取使用者資訊

6、github確認令牌沒有問題,返回交流學習社群一些使用者的基本資訊

二、在github申請OAuth App

在設定-->開發者設定-->授權應用裡,新建一個應用

sau交流學習社群第三方登陸github--oauth來實現使用者登入

按照要求填寫應用的一些東西

Application Name:應用名稱(重要)

HomePageURL:網站的URL

ApplicationDescription:網站描述

Authorization callback URL:回撥地址 (重要)

三、開始填寫這些內容

以sau交流學習社群(www.mwcxs.top)的授權登陸作為例子,使用的是基於thinkjs開發的nodejs全棧應用。

1、訪問使用者登入的驗證介面

https://github.com/login/oauth/authorize?client_id=xxxxxxxxxxxxxxxxxx&scope=user,public_repo
複製程式碼

sau交流學習社群第三方登陸github--oauth來實現使用者登入

2、訪問上面介面後,github會讓跳轉到你預定的url(就是授權的回撥地址(Authorization callback URL))

http://localhost:8080/callback?code=****************
複製程式碼

3、開發者可以通過code,client_id以及client_secret這三個引數獲取使用者的access_token即使用者身份標識,請求如下

https://github.com/login/oauth/access_token?client_id=xxxxxxxxxxxxxxxxxxx&client_secret=xxxxxxxxxxxxxxxxx&code=xxxxxxxxxxxxxxxxxxx
複製程式碼

這樣就會返回access_token

4、這樣我們就可以用這個access_token來獲取使用者的資訊

https://api.github.com/user?access_token=xxxxxxxxxxxxxxxxx xxxxxxxx
複製程式碼

四、總結

sau交流學習社群第三方登陸github--oauth來實現使用者登入

回撥地址就是說,當使用者點選授權後,需要呼叫的介面。

注:thinkjs預設使用model/contoller/action方法的路由定義方式

sau交流學習社群第三方登陸github--oauth來實現使用者登入

相關文章