Which UI do you use?

Custom UI

Pre built UI

3. Exposing Auth APIs

We will add all the backend APIs for auth on /.netlify/functions/auth/*. This can be changed by setting the apiBasePath property in the appInfo object on the backend and frontend. For the rest of this page, we will assume you are using /.netlify/functions/auth/*.

1) Create the netlify/functions/auth.js page

• Be sure to create the netlify/functions/ folder.
• An example of this can be found here.

netlify/functions/auth.ts

import supertokens from "supertokens-node";
import { middleware } from "supertokens-node/framework/awsLambda";
import middy from "@middy/core";
import cors from "@middy/http-cors";
import { getBackendConfig } from "../../config/supertokensConfig";

supertokens.init(getBackendConfig());

module.exports.handler = middy(middleware(async (event, context) => {
    if (event.httpMethod === "OPTIONS") {
        return {
            statusCode: 200,
            body: ""
        }
    }
    
    return {
        statusCode: 404,
        body: "Not Found",
    }
})).use(
    cors({
        origin: getBackendConfig().appInfo.websiteDomain,
        credentials: true,
        headers: ["Content-Type", ...supertokens.getAllCORSHeaders()].join(", "),
        methods: "OPTIONS,POST,GET,PUT,DELETE",
    })
).onError(request => {
    throw request.error;
});

important

• Notice that we called supertokens.init above. We will need to call this in all API endpoints that use any functions related to supertokens.
• CORS is only needed if you are hosting your frontend using a separate domain (if your website domain is different that your API's domain).