谷歌登錄頁面刷新時未登錄（聚合物）

我正在實施「Google登錄」進入我的網站以處理所有用戶身份驗證等。我將有一個後端數據庫，用於存儲信息以防止用戶跟蹤他們的個人資料和他們的行爲等。谷歌登錄頁面刷新時未登錄（聚合物）

我已經關注了Google開發者文檔，並且在網頁上有一個「Google登錄」按鈕，當點擊此按鈕時，我選擇我的帳戶並且已登錄並且id_token已關閉，並且已成功與我的後端服務器進行了身份驗證。我現在遇到的唯一問題是，當我刷新頁面時，該按鈕返回到「登錄」而不是保持登錄狀態，這是正常行爲還是有我缺少的東西？我不希望用戶每次頁面更改時都必須重新登錄。

在一個側面說明我已成功地將id_token成功登錄到谷歌在localStorage，然後使用這個id_token與後端服務器自動重新認證（你可以在註釋掉的代碼中看到的）存儲，但這顯然不會自動改變「Google登錄」按鈕的狀態，這會讓客戶端的用戶感到困惑。

任何人都可以解釋這個問題嗎？

沒有登錄：

在簽名（目前不留這樣的頁面刷新後）後：

login.html：個

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Login</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <link rel="stylesheet" href="./css/base.css"/> <!-- Base CSS --> 
     <script src="./js/all.js"></script> <!-- All JavaScript file --> 
     <script src="./js/Logger.class.js"></script> <!-- Logger class --> 
     <script src="./bower_components/jquery/dist/jquery.min.js"></script> <!-- jQuery --> 
     <script src="./js/gSignIn.js"></script> 
     <!-- Polymer --> 
     <script src="./bower_components/webcomponentsjs/webcomponents-lite.min.js"></script> <!-- Web Components Import --> 
     <!-- Element Imports --> 
     <link rel="import" href="./bower_components/paper-button/paper-button.html"/> 
     <link rel="import" href="./bower_components/google-signin/google-signin.html"/> 
    </head> 
    <body> 
     <google-signin id="gSignIn" client-id="--- REMOVED FOR PRIVACY ---" scopes="profile email openid"></google-signin> 
     <a href="#" id="signOut">Sign Out</a> 
    </body> 
</html>

gSignIn.js：

/** 
* Google Sign In JavaScript 
*/ 

$(document).ready(function() { 
    var logger = new Logger("gSignIn.js", false); // logger object 
    var id_token = null; 
    logger.log("Load", "Successful"); 

    // Try to automatically login 
// if (localStorage !== null) { // If local storage is available 
//  if (localStorage.getItem("gIDToken") !== null) { // If the Google ID token is available 
//   id_token = localStorage.getItem("gIDToken"); 
//   // Send off AJAX request to verify on the server 
//   $.ajax({ 
//    type: "POST", 
//    url: window.api.url + "googleauth/verify/", 
//    data: { "id_token": id_token }, 
//    success: function (data) { 
//     if (!data.error) { // If there was no error 
//      logger.log("Google SignIn", "Successfully signed in!"); 
//     } 
//    } 
//   }); 
//  } 
// } 

    /** 
    * EVENT: Google SignIn success 
    */ 
    $("#gSignIn").on("google-signin-success", function() { 
     id_token = getGoogleAuthResponse().id_token; 
     var profile = getGoogleProfile(); 

     console.log("ID: " + profile.getId()); // Don't send this directly to your server! 
     console.log("Name: " + profile.getName()); 
     console.log("Image URL: " + profile.getImageUrl()); 
     console.log("Email: " + profile.getEmail()); 

     // Send off AJAX request to verify on the server 
     $.ajax({ 
      type: "POST", 
      url: window.api.url + "googleauth/verify/", 
      data: { "id_token": id_token }, 
      success: function (data) { 
       if (!data.error) { // If there was no error 
        logger.log("Google SignIn", "Successfully signed in!"); 

        // Store the id_token 
        if (localStorage !== null) { // If localStorage is available 
         localStorage.setItem("gIDToken", id_token); // Store the id_token 
        } 
       } 
      } 
     }); 
    }); 

    $("#signOut").click(function() { 
     var auth2 = gapi.auth2.getAuthInstance(); 
     auth2.signOut().then(function() { 
      console.log("User signed out."); 
     }); 
    }); 

    /** 
    * Get Google Profile 
    * 
    * @returns object 
    */ 
    var getGoogleProfile = function() { 
     var profile = gapi.auth2.getAuthInstance().currentUser.get().getBasicProfile(); 
     return profile; 
    }; 

    /** 
    * Get Google Auth Response 
    * 
    * @returns object 
    */ 
    var getGoogleAuthResponse = function() { 
     var response = gapi.auth2.getAuthInstance().currentUser.get().getAuthResponse(); 
     return response; 
    }; 
});

謝謝！

來源

2015-08-15 EM-Creations

我遇到了同樣的問題，在確保啓用了第三方cookie之後，在這種情況下，它返回到主機名localhost。

最後，我不得不僞造使用/etc/hosts的域，確保Google開發人員儀表板將該域列入白名單，並開始使用該域而不是本地主機。

我只能假設gapis不喜歡localhost，即使它在我的Google開發人員儀表板中列入了我所使用帳戶的白名單。如果你確實設法讓localhost工作，請給我一個呼喊！

來源

2015-08-16 02:20:38 newfivefour

謝謝！我會現在嘗試:) –

它的工作感謝：D –

非常感謝。沒有，真的，謝謝！我瘋了試圖找出這一個！如果可以的話，我會投十倍！ –

另一種方法是從非標準端口（不是80）訪問本地主機。我設法通過使用從端口80到81的nginx代理來解決這個頭痛問題：

server { 
    listen 81; 

    location/{ 
    proxy_pass http://localhost:80; 
    } 
}

來源

2017-05-30 20:58:31

谷歌登錄頁面刷新時未登錄（聚合物）

回答

相關問題