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

Question

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

我一直在使用 context API 和 React，到目前为止它一直在工作，直到我需要 SSR 从 API 获取数据。我想获取当前用户 ID，这样我就可以获得存储在 Firestore 中的令牌。

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>
  );
}

固态继电器

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

  //fetch api

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

Answer 1

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

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!');
      }
    );
});

您可以读取sessioncookiegetServerSideProps并验证它以获取用户的 UID：

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