Using with Firebase Auth

[cakirilker]

Hello everyone 👋

First of all thank you to all contributers for this awesome library. I would like to ask some questions about authentication with firebase/auth in combination with remix-auth package as I am really confused.

So I am using Email/Password login from firebase/auth and in my Authenticator I am using FormStrategy and I return the response of signInWithEmailAndPassword (which contains the user). And then I set the cookie with my sessionStorage which I created by using createCookieSessionStorage from @remix-run/node.

// auth.server.ts
authenticator.use(
  new FormStrategy<User>(async ({ form }) => {
    const email = String(form.get("email")).trim();
    const password = String(form.get("password")).trim();

    if (!email || email?.length === 0)
      throw new AuthorizationError("Invalid Email");
    if (!password || password?.length === 0)
      throw new AuthorizationError("Invalid Password");

    try {
      const res = await signInWithEmailAndPassword(auth, email, password);
      ...

// session.server.ts
export const sessionStorage = createCookieSessionStorage({
  cookie: {
    name: "_session",
    sameSite: "lax",
    path: "/",
    httpOnly: true, 
    secrets: [`${process.env.AUTH_SECRET}`], 
    secure: process.env.NODE_ENV === "production",
    maxAge: 60 * 60 * 24 * 7 // 7 Days
  },
});

So far it seems fine, however the problem starts when I try to use the token in _session cookie. I am setting the session cookie to be valid for 7 days however the idToken that I get from firebase (via signInWithEmailAndPassword) is has a maxAge of 1 hour by default. And when I hit to to the go service I have with this token it fails to verify the token as it's already expired but since the session cookie is still not expired I can navigate like my token is valid.

I am sure I am missing something or doing something wrong but I cannot wrap my head around it. Am I supposed to use different strategy other than FormStrategy Maybe OAuth2Strategy? It would be great if you can point me to the right direction to use as I am really confused right now :/

Thanks 🙏

[sergiodxa]

Firebase should be giving you a refresh token that you can use to get a new access token, although an access token that expires in an hour is ok for a SPA/native app but not for an app like Remix where the token is stored securely in a cookie and accessed only server-side, if you could configure Firebase to never expire or give you larger expiration times would helps you a lot.

[cakirilker]

Alright, so after reading article by @sergiodxa and another one I found, I was able to have it working properly.
https://sergiodxa.com/articles/working-with-refresh-tokens-in-remix
https://invertase.io/blog/remix-firebase-auth (In this article firebase-admin package is used but I have it on my go service, so everything done here with firebase-admin package is done externally in my case)

Basically what I am doing is once user sign in/sign up I create a session cookie in auth.server.ts authenticator function and return it. The created session cookie has 5 days of validity and created with firebase createSessionCookie function. Then I store it with session.server.ts with a longer validity (30 days) as secure cookie.

Then in loder function of my protected routes first I check if user is authenticated (has session cookie in browser) with authenticator.isAuthenticated. And after that I verify the token(session cookie from firebase) via firebase, and if it's success full I continue regular flow. If it's not, then I get a new token with refresh token which in return I get a new idToken. Then I do something similar to what I did on signin/signup and create a new session cookie via firebase and store it in browser cookies with session.server.ts.

The reason I am creating a session cookie with firebase is because firebase only gives you one hour valid token, but with createSessionCookie you can get a token with customised expirity (min. 5 mins, max. 14 days).

Hope this will help anyone, or maybe someone will give better solution. Thanks @sergiodxa 🙏