I'm very confused about how to get the current user with SSR to get some user data.
I've been using the context API with react, and it's been working so far, until I need SSR to get data from an API. I want to get the current user id, so I can get a token that is stored in 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>
);
}
SSR
export async function getStaticProps() {
const api = {
auth: "token",
};
//fetch api
return {
props: {
data,
},
};
}
Firebase SDKs are meant to be used on client side only so you won't be able to get current user on server side unless you set a cookie. Whenever a user logs in, you can call your API which will create a session cookie using Firebase Admin and set it.
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!');
}
);
});
You can read the session cookie in getServerSideProps and verify it to get user's UID:
const decoded = await admin.auth().verifySessionCookie(sessionCookie)