即使不尝试访问数据，Firestore应用程序也会丢失或不足权限

Question

我一直在YouTube上关注Demo视频，以学习Firebase Auth，该firebase Auth也将Firestore用于数据库。我已经修改了一些我的时间以显示登录用户时的食谱列表，并且只允许用户登录新食谱。出来，他们看到的所有登录时间都是要登录的消息。我还修改了Firestore中的规则，以便在登录用户时仅允许访问数据。

service cloud.firestore {
    match /databases/{database}/documents {
        match /{document=**} {
            allow read, write: if request.auth != null;
        }
    }
}

那只是其文档中提供的基本代码。它运行良好，直到我尝试创建一个食谱，同时通过通过开发工具显示按钮并尝试提交新食谱以测试规则并确保它不允许它来登录。现在，除非我删除Firestore中的规则，否则页面错误一次之前，除非完全加载。如果我允许访问，一切都按预期工作。

const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const db = getFirestore(app);
const querySnapshot = await getDocs(collection(db, "Recipes"));
//listen for auth status
onAuthStateChanged(auth, (user) => {
  console.log(user);
  if (user) {
    setupRecipes(querySnapshot);
    setupUI(user);
  } else {
    setupRecipes([]);
    setupUI();
  }
});

const recipeList = document.querySelector(".recipes");
const loggedOutLinks = document.querySelectorAll(".logged-out");
const loggedInLinks = document.querySelectorAll(".logged-in");

const setupUI = (user) => {
  if (user) {
    loggedInLinks.forEach((item) => (item.style.display = "block"));
    loggedOutLinks.forEach((item) => (item.style.display = "none"));
  } else {
    loggedInLinks.forEach((item) => (item.style.display = "none"));
    loggedOutLinks.forEach((item) => (item.style.display = "block"));
  }
};

const setupRecipes = (data) => {
  let html = "";
  let ingredientList = "";
  data.forEach((doc) => {
    const recipe = doc.data();
    ingredientList = "";
    recipe.ingredients.forEach((ingredient) => {
      ingredientList += `<li>${ingredient}</li>`;
    });
    const li = `
      <li>
        <div class="collapsible-header grey lighten-4">${recipe.title}</div>
        <div class="collapsible-body white">
          <h4 style="margin: 0 0 10px 0;">Ingredients</h4>
          <ul class="ingredientList">
            ${ingredientList}
          </ul>
        </div>
      </li>
    `;
    html += li;
  });
  if (html.length !== 0) {
    recipeList.innerHTML = html;
  } else {
    recipeList.innerHTML =
      '<h4 class="center-align">Login to view recipes</h4>';
  }
};

因此，我想我的问题是：是否以某种方式保留了不良的请求，还是我试图在某个地方访问数据而不意识到数据？我已经尝试清除缓存并重新启动我的应用程序运行的本地服务器，但是唯一的唯一方法是将页面加载到消息上，告诉用户登录，是将其登录到Firestore中的规则，并允许访问全部。当规则存在时，我会立即在页面加载上获得以下内容：127.0.0.1/:1未接收的FirebaseError：丢失或不足的权限。任何帮助都将不胜感激，我很乐意在需要时提供更多代码。

Answer 1

正如上面评论中所指出的，在用户登录之前发生了对数据库的查询。我将 getDocs 调用移至 onAuthStateChanged 函数中，并且仅在用户存在时调用它，现在允许在签名时加载页面因为除非授权用户登录，否则不会尝试检索任何内容

const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const db = getFirestore(app);

//listen for auth status
onAuthStateChanged(auth, async(user) => {
  console.log(user);
  if (user) {
    const querySnapshot = await getDocs(collection(db, "Recipes"));
    setupRecipes(querySnapshot);
    setupUI(user);
  } else {
    setupRecipes([]);
    setupUI();
  }
});