Protected API Routes in with-firebase-authentication example

[vijaynandwani]

Dear next.js community,

Thank you for such a nice project and an active community. I am new to Next.Js and have been trying to understand how does Firebase Authentication example works.

My project requires me to have an API because some non-Nextjs part of the website needs to make request to the API. So I cannot use getServerSideProps for that part and need to make a protected API route.

My solution was to use the cookie that the example stores in the browser and use the cookie data to authenticate users. Here is my implementation. Am I doing this the right way?

/utils/middleware/protectedApi.js

import { verifyIdToken } from "../auth/firebaseAdmin";
import * as jwtDecode from "jwt-decode";

// Lets Decode the Cookie
// Extract the token from the cookie
// Verify the token from Firebase
// If token is verified, that means the user is logged in, proceed to API route

export const protectedApi = (fn) => (req, res) => {
  try {
    var decodedHeader = jwtDecode(req.cookies["express:sess"], {
      header: true,
    });
    verifyIdToken(decodedHeader.token)
      .then((decodedToken) => {
        req.decodedToken = decodedToken;
        return fn(req, res);
      })
      .catch((error) => {
        res.status(401).json({ message: "HELL" });
      });
  } catch (err) {
    // Unable to decode the cookie. Provide 401 to user
    res.status(401).json({ message: "Sorry you are not authenticated" });
  }
};

and here is the API route

/pages/api/test.js

import { protectedApi } from "../../utils/middleware/protectedApi";

export default protectedApi(async function (req, res) {
  //The below variable has user details.
  console.log(req.decodedToken);
  res.end("hello");
});

Please let me know if there is a better way to do this.

Thank you once again!
Regards
Vijay

[vijaynandwani]

I realized that idToken expire in one hour. And the cookie doesn't have the updated Token.

I removed verifyIdToken check, extracted values from cookie using jwt-decode, added the values to req, and proceeded to API route.

In my API I am checking if user_id has access to perform the action or not