刷新頁面時，客戶端 Firebase 似乎認(rèn)為我有經(jīng)過身份驗證的用戶，但 firestore firebase 規(guī)則暗示我沒有經(jīng)過身份驗證的用戶。
我有一個 Firebase 應(yīng)用程序，用戶通過 signInWithEmailAndPassword 使用電子郵件和密碼登錄。我將持久性設(shè)置為 browserLocalPersistence。通常，當(dāng)用戶登錄時，會使用經(jīng)過身份驗證的用戶對象調(diào)用 onAuthStateChanged 方法，并且應(yīng)用程序可以正常運行。當(dāng)用戶刷新頁面時，我的 onAuthStateChanged 方法會再次使用非空用戶觸發(fā)，但由于我的安全規(guī)則，所有 Firebase 查詢都會失敗。我在那里做錯了什么。
這是一個reactjs應(yīng)用程序。如果我可以提供任何其他可能會給您帶來啟發(fā)的答案，請告訴我。
我的 firebase 規(guī)則：
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /{document=**} {
allow read, write: if isAuthenticated();
}
function isAuthenticated() {
return request.auth != null && request.auth.uid != null;
}
}
}
我的登錄代碼：
setPersistence(sharedFirebaseAuth, browserLocalPersistence)
.then(() => {
signInWithEmailAndPassword(sharedFirebaseAuth, email, password)
.then((userCredential) => {
})
.catch((error) => {
});
})
我的 onAuthStateChanged 代碼
onAuthStateChanged(sharedFirebaseAuth, (user) => {
if(user){
user.reload().then(()=>{
requestDocs();
});
}
}) 
2
0
0
我想你忘記了 read 和 write 之間的逗號，應(yīng)該看起來像 allow read, write: if isAuthenticated();
我最終不得不實現(xiàn)一個身份驗證提供程序，以便它保留我的用戶信息。
新文件 AuthContext.tsx
import React from "react"
import { User } from "firebase/auth";
export const AuthContext = React.createContext(null)
新文件 AuthProvider.tsx
import { FC, useEffect, useState } from "react";
import { User } from "firebase/auth";
import { sharedFirebaseAuth } from "../Utils/SharedFirebase";
import { AuthContext } from "./AuthContext";
export interface AuthProviderProps {
children: JSX.Element;
}
export const AuthProvider: FC = ({ children }: AuthProviderProps) => {
const [user, setUser] = useState(null);
useEffect(() => {
const unsubscribe = sharedFirebaseAuth.onAuthStateChanged((firebaseUser) => {
setUser(firebaseUser);
});
return unsubscribe
}, []);
return (
{children}
);
};
然后我像這樣更新了我的index.tsx
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';
import { AuthProvider } from './provider/AuthProvider';
import "bootstrap/dist/css/bootstrap.min.css";
const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement
);
root.render(
);
然后將我調(diào)用 onAuthStateChanged 的?? app.tsx 部分更新為以下內(nèi)容
const user = useContext(AuthContext);
useEffect(() => {
if(user){
requestDocs();
}
},[user]);
刷新后，它似乎保留了所有必要的身份驗證信息來提取文檔。
