Firebase 在沒有用戶登錄的情況下限制對其他頁面的訪問

Question

我有一個 index.html 頁面，它將在正確登錄后重定向到 home.html。 我已經解決了登錄和注銷部分。 我的問題是我可以直接在 URL 上訪問 home.html 而無需登錄。

這是我的 home.html 的一些片段

<script>
var config = {
apiKey: "xxxxxx",
authDomain: "firebaseapp.com",
databaseURL: "firebaseio.com",
};


firebase.initializeApp(config);
const auth=firebase.auth();
const db=firebase.database();


var user = firebase.auth().currentUser;
if (user) {
//blank if correct login
} else {
window.location.href = 'firebaseapp.com/index.html'; 
}
</script>

我把它放在 home.html 的開頭，這樣如果頁面將被直接訪問，它將返回到索引。 它可以重定向到 index.html 但是即使我正確登錄，它仍然將我重定向到 index.html

似乎 firebase 獲得身份驗證的速度太快，以至於無法正確初始化 currentUser 值，從而給出空結果。 關於如何使用 URL 限制直接訪問的任何建議都會真正有幫助。

謝謝！

Answer 1

嘗試使用firebase.auth().onAuthStateChanged而不是firebase.auth().onAuthStateChanged firebase.auth().currentUser; 這是獲取當前用戶的推薦方法。

通過currentUser獲取用戶可能會導致與您所看到的類似的問題。 這是來自firebase的官方文檔。

注意： currentUser 也可能為 null，因為 auth 對象尚未完成初始化。 如果您使用觀察者來跟蹤用戶的登錄狀態，則不需要處理這種情況。

嘗試像這樣獲取當前用戶：

firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    // User is signed in.
  } else {
    // No user is signed in.
  }
});

Answer 2

我不是那種有經驗的噴氣機，但這對我有用，但我不確定這是否是最好的方法。 我只是給我的身體一個 id 並添加了這個 JavaScript 代碼：

 var auth = firebase.auth();

auth.onAuthStateChanged(function(user) {

  if (user) {
    document.getElementById('homeBody').style.visibility = "visible";
  } else {
    document.getElementById('homeBody').style.visibility = "hidden";
  }

});

我認為這對初創公司來說是可行的。 隨着您業務的增長，我建議您考慮采取更多安全措施