Hey, I was trying out supertokens with one of our Next.js application. The application has a basepath prefix so that all the pages gets prefixed after that.. eg: if the prefix is /kb, home page (index.tsx) will be rendered under /kb and others will be like /kb/api/x, /kb/page1 etc.... I followed the sample nextjs app to see if it works but unfortunately it doesnt render the login ui if I have a basepath prefix (as the auth page is at /prefix/auth and all the apis are at /prefix/api/auth/). this is how my appInfo.ts looks like, where /kb is the prefix

const port = process.env.APP_PORT || 3000

const apiBasePath = '/kb/api/auth/'

export const websiteDomain =
  process.env.APP_URL ||
  process.env.NEXT_PUBLIC_APP_URL ||
  `http://localhost:${port}`

export const appInfo = {
  appName: 'Sample App',
  websiteDomain,
  apiDomain: websiteDomain,
  apiBasePath,
}

If I remove the prefix the UI gets rendered well. I can see the requests are being hit to respective files but the UI doesnt seem to get rendered. Any other change should I make to get it working with a basepath in next apps?

hey @haxzie.

Oh awesome! it's working now

This also means that in the pages directory, you will have to change the location of the

pages/auth/[[...path]].tsx

file as well as of the

pages/api/auth/[[...path]].tsx

fule

The files are already under /pages/auth/[[...path]] and /pages/api/auth/[[..path]] I just changed the websiteBasePath and it's working

hmm ok

I got the UI to be rendered. But the API requests are failing with 404

can you enable the backend debug log and show the output?

i don't see any logs, is there a way I can enable the debug?

add the env var

DEBUG=com.supertokens

Have you set the right apiBasePath on the frontend as well?

Yes, the apiBasePath is /kb/api/auth

Well it seems like something is removing the /kb cause the request path the SDK is seeing is without /kb

is there something I am missing? or where should I add the backend apiBasePath?

apiBasePath and apiGatewayPath goes inside the

appInfo

object

what about the backend apiBasePath?

that should be

/api/auth

That screenshot is from appInfo.ts

yes

Worked 🙌 Thanks