Hi! I'm trying to implement UserRoles in my nextjs app and I'm getting ```Initialisation not done. ...
f
Hi! I'm trying to implement UserRoles in my nextjs app and I'm getting
Copy code
Initialisation not done. Did you forget to call the UserRoles.init or SuperTokens.init functions?
when I try to create a role. Does anyone have an idea what I could be doing wrong?
n
Hi @fatih.55
You need to import and initialise the user roles recipe in your backend
The docs should explain this
f
Should be enough to add UserRoles.init(), to the recepies list for the backendConf right?
n
Yep
f
I did that, still doesn't work
n
Can I see the full backend config
f
Copy code
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
import EmailPasswordNode from "supertokens-node/recipe/emailpassword";
import SessionNode from "supertokens-node/recipe/session";
import { appInfo } from "./appInfo";
import type { TypeInput } from "supertokens-node/types";
import Dashboard from "supertokens-node/recipe/dashboard";
import UserRoles from "supertokens-node/recipe/userroles";
import { env } from "~/env.mjs";

export const backendConfig = (): TypeInput => {
  return {
    framework: "express",
    supertokens: {
      // These are the connection details of the app you created on supertokens.com
      connectionURI: env.SUPERTOKENS_CONNECTION_URI,
      apiKey: env.SUPERTOKENS_API_KEY,
    },
    appInfo,
    recipeList: [
      EmailPasswordNode.init(),
      SessionNode.init(),
      UserRoles.init(),
      Dashboard.init(),
    ],
    isInServerlessEnv: true,
  };
};
n
And where are you calling SuperTokens.init?
f
I followed the nextjs integration tutorial in the docs, so I only have it in _app.tsx
n
Your API paths also need to include it
f
Oh right it is also in there, that was a file I just copied from the docs, that's why I wasn't aware of it
n
Ah right, can I see the API file?
f
Copy code
import { superTokensNextWrapper } from "supertokens-node/nextjs";
import { middleware } from "supertokens-node/framework/express";
import type { NextApiRequest, NextApiResponse } from "next";
import supertokens from "supertokens-node";
import { backendConfig } from "~/config/backendConfig";
import NextCors from "nextjs-cors";

const getBaseUrl = () => {
  if (process.env.VERCEL_URL) return `https://${process.env.VERCEL_URL}`; // SSR should use vercel url
  return `http://localhost:${process.env.PORT ?? 3000}`; // dev SSR should use localhost
};

supertokens.init(backendConfig());

export default async function superTokens(
  req: NextApiRequest,
  res: NextApiResponse,
) {
  // NOTE: We need CORS only if we are querying the APIs from a different origin
  await NextCors(req, res, {
    methods: ["GET", "HEAD", "PUT", "PATCH", "POST", "DELETE"],
    origin: getBaseUrl(),
    credentials: true,
    allowedHeaders: ["content-type", ...supertokens.getAllCORSHeaders()],
  });

  await superTokensNextWrapper(
    async (next) => {
      // This is needed for production deployments with Vercel
      res.setHeader(
        "Cache-Control",
        "no-cache, no-store, max-age=0, must-revalidate",
      );
      await middleware()(req, res, next);
    },
    req,
    res,
  );
  if (!res.writableEnded) {
    res.status(404).send("Not found");
  }
}
I don't think I touched this file
n
You will also need to include it in the API where you are using the user roles recipe
Basically all the API files need to include
supertokens.init(backendConfig());
f
Ah I see, so any time I'm doing anything with supertokens in the backend, I should be throwing a
Copy code
supertokens.init(backendConfig());
in there?
n
Yep with Next JS thats a requirement
f
Ok makes sense, thank you for the really fast support :D
n
Happy to help!
2 Views