PassportJS + RestAPI + SPA

Question

我使用ExpressJS來構建RestAPI，客戶端是SPA，並且通過PassportJS支持Google/FaceBook/GitHub/...進行身份驗證。我的問題，從社交登錄回調將返回到RestAPI或SPA？如果系統返回到RestAPI，那麼如何將SPA重定向到主頁。另一種情況是，如果系統回調SPA，RestAPI如何從客戶端接收和驗證令牌。請讓我知道常用的方法。

感謝，

Answer 1

您提供的回調URL到驗證服務，您決定是否處理由SPA或API的路線。 Oauth認證（簡化）有兩個步驟。在GitHub上插圖：

步驟1）https://github.com/login/oauth/authorize?client_id=*YOUR_CLIENT_ID*$redirect_uri=*YOUR_REDIRECT_URI*
打開，要求用戶授權您的應用程序一個彈出式對話框，如果成功返回到您的REDIRECT_URI與查詢參數代碼= AUTHORIZATION_CODE

步驟2）？您通過​​

將上述AUTHORIZATION_CODE交換爲長期訪問令牌在您的架構中，您應該在SPA中執行第1步，在其他api中執行第2步。您應該依靠spa從認證服務提供商獲取授權代碼，將其發送給您的其餘api，讓其餘api交換長期訪問令牌，將該令牌保存到數據庫，使用它來檢索用戶信息或執行無論你想用它，然後登錄用戶。

對於第1步，您只需要CLIENT_ID，對於第2步CLIENT_ID和CLIENT_SECRET，以便您可以通過僅將CLIENT_SECRET存儲在服務器端來保持應用程序的安全。

由你的rest api處理回調uri的問題在於，回調uri被驗證提供者（在本例中爲github）而不是由你的SPA調用，因此你不能發送重定向響應用戶轉到主頁。這隻有在您的模板和路由在服務器端進行處理時纔有效，我認爲在您的體系結構中並非如此。

從文檔中並不明顯，但是當您在類似app.post('/login', passport.authenticate('github'),的路由上註冊護照中間件時，中間件會檢查'code'查詢參數是否包含AUTHORIZATION_CODE，如果不是，則它會啓動步驟1，如果是第2步。

Answer 2

我使用了相同的堆棧（express，angular，passport）並遵循該方法。

我創建了一個按鈕。

<a href="/auth/facebook">Login with facebook</a> 

而且我有護照

// send to facebook to do the authentication 
    app.get('/auth/facebook', passport.authenticate('facebook', {scope: 'email'})); 

    // handle the callback after facebook has authenticated the user 
    app.get('/auth/facebook/callback', passport.authenticate('facebook', { 
    successRedirect: '/#/profile', 
    failureRedirect: '/' //Redirect Homepage 
    })); 

兩條路線這段代碼表明，如果你成功登錄，你會重定向到角航線（/＃/配置文件）重定向後你就會有一個cookie其中有一個名爲connect.sid的令牌，因爲passportjs使用快速會話。

然後你就可以檢查用戶是否在到處登錄該中間件

// route middleware to ensure user is logged in 
function isLoggedIn(req, res, next) { 
    if (req.isAuthenticated()) 
    return next(); 

    res.redirect(301, '/'); 
} 

你可以看看我的倉庫包含上面的代碼。 https://github.com/AOnurOzcan/meanTest

如果您遇到問題，請讓我知道。