javascript - Next.js 获取SSR中的用户数据

Question

我很困惑如何通过SSR让当前用户获取一些用户数据。

我一直在 React 中使用上下文 API，到目前为止它一直有效，直到我需要 SSR 从 API 获取数据。我想获取当前用户 ID，以便获取存储在 Firestore 中的 token 。

Auth.js

export const AuthContext = createContext();

export function AuthProvider({ children }) {
  const [currentUser, setCurrentUser] = useState(null);

  useEffect(() => {
    onAuthStateChanged(auth, (user) => {
      setCurrentUser(user);
    });
  }, []);

  return (
    <AuthContext.Provider value={{ currentUser }}>
      {children}
    </AuthContext.Provider>
  );
}

SSR

export async function getStaticProps() {
  const api = {
    auth: "token",
  };

  //fetch api

  return {
    props: {
      data,
    },
  };
}

Answer 1

Firebase SDK 只能在客户端使用，因此除非您设置 Cookie，否则您将无法在服务器端获取当前用户。每当用户登录时，您都可以调用 API，这将创建 session cookie使用 Firebase Admin 并进行设置。

app.post('/sessionLogin', (req, res) => {
  const idToken = req.body.idToken.toString();
  const expiresIn = 60 * 60 * 24 * 5 * 1000;

  return admin
    .auth()
    .createSessionCookie(idToken, { expiresIn })
    .then(
      (sessionCookie) => {
        const options = { maxAge: expiresIn, httpOnly: true, secure: true };
        res.cookie('session', sessionCookie, options);
        res.end(JSON.stringify({ status: 'success' }));
      },
      (error) => {
        res.status(401).send('UNAUTHORIZED REQUEST!');
      }
    );
});

您可以读取getServerSideProps中的session cookie并验证它以获取用户的UID:

const decoded = await admin.auth().verifySessionCookie(sessionCookie)