Website Base Path

Step 1) Front End Change#

Since the beginning of this guide, you probably noticed that all the front-end routes for SuperTokens widget are prefixed by /auth. You can change this value in the init function by setting websiteBasePath.

ReactJS
Angular
Vue

import SuperTokens from "supertokens-auth-react";

SuperTokens.init({
    appInfo: {
        appName: "yourAppName",
        apiDomain: "yourApi",
        websiteDomain: "yourWebsite",
        websiteBasePath: "/authentication"
    },
    recipeList: [],
});

important

These changes only apply to the supertokens-auth-react init. Please also make sure to change where supertokensAuthComponent.tsx is rendered in your app based on the new value of websiteBasePath.

/app/auth/supertokensAuthComponent.tsx

import SuperTokens from "supertokens-auth-react";

SuperTokens.init({
    appInfo: {
        appName: "yourAppName",
        apiDomain: "yourApi",
        websiteDomain: "yourWebsite",
        websiteBasePath: "/authentication"
    },
    recipeList: [],
});

important

These changes only apply to the supertokens-auth-react init. Please also make sure to change where Supertokens.tsx is rendered in your app based on the new value of websiteBasePath.

/components/Supertokens.tsx

import SuperTokens from "supertokens-auth-react";

SuperTokens.init({
    appInfo: {
        appName: "yourAppName",
        apiDomain: "yourApi",
        websiteDomain: "yourWebsite",
        websiteBasePath: "/authentication"
    },
    recipeList: [],
});

Step 2) Back End Change#

You also need to change the websiteBasePath in your backend code:

NodeJS
GoLang
Python

import SuperTokens from "supertokens-node";

SuperTokens.init({
    appInfo: {
        appName: "yourAppName",
        apiDomain: "yourApi",
        websiteDomain: "yourWebsite",
        websiteBasePath: "/authentication"
    },
    recipeList: [],
});

import "github.com/supertokens/supertokens-golang/supertokens"

func main() {
    websiteBasePath := "/authentication"
    supertokens.Init(supertokens.TypeInput{
        AppInfo: supertokens.AppInfo{
            AppName:       "yourAppName",
            APIDomain:     "yourApi",
            WebsiteDomain: "yourWebsite",
            WebsiteBasePath: &websiteBasePath,
        },
    })
}

from supertokens_python import init, InputAppInfo

init(
    app_info=InputAppInfo(
        app_name='yourAppName',
        api_domain='yourApi',
        website_domain='yourWebsite',
        website_base_path='/authentication'
    ),
    
    framework='...', 
    recipe_list=[
      #...
   ]
)