Authentication using JWTs

important

Using SuperTokens with Hasura requires you to host your own API layer that uses our Backend SDK. If you do not want to host your own server you can use a serverless environment (AWS Lambda for example) to achieve this.

1) Complete the quick setup#

Follow the quick setup guide to setup SuperTokens

2) Enable the JWT feature#

NodeJS
GoLang
Python

import SuperTokens from "supertokens-node";import Session from "supertokens-node/recipe/session";
SuperTokens.init({    supertokens: {        connectionURI: "..."    },    appInfo: {        apiDomain: "...",        appName: "...",        websiteDomain: "..."    },    recipeList: [        Session.init({            jwt: {                enable: true,            },        })    ]});

import (    "github.com/supertokens/supertokens-golang/recipe/session"    "github.com/supertokens/supertokens-golang/recipe/session/sessmodels"    "github.com/supertokens/supertokens-golang/supertokens")
func main() {    supertokens.Init(supertokens.TypeInput{        RecipeList: []supertokens.Recipe{            session.Init(&sessmodels.TypeInput{                Jwt: &sessmodels.JWTInputConfig{                    Enable: true,                },            }),        },    })}

from supertokens_python import init, InputAppInfofrom supertokens_python.recipe import session
init(    app_info=InputAppInfo(api_domain="...", app_name="...", website_domain="..."),    framework='...',     recipe_list=[        session.init(            jwt=session.JWTConfig(                enable=True,                # This is an example of a URL that ngrok generates when                # you expose localhost to the internet                issuer='https://0d53-2405-201-e-d8bd-587b-3674-124d-4208.ngrok.io/auth'            )        )    ])

info

To learn more about using JWTs with SuperTokens refer to this page.

3) Add custom claims to the JWT#

caution

Hasura requires claims to be set in a specific way, read the official documentation to know more.

NodeJS
GoLang
Python

import SuperTokens from "supertokens-node";import Session from "supertokens-node/recipe/session";
SuperTokens.init({    supertokens: {        connectionURI: "...",    },    appInfo: {        apiDomain: "...",        appName: "...",        websiteDomain: "..."    },    recipeList: [        Session.init({            jwt: {                enable: true,            },            override: {                functions: function (originalImplementation) {                    return {                        ...originalImplementation,                        createNewSession: async function (input) {                            input.accessTokenPayload = {                                ...input.accessTokenPayload,                                "https://hasura.io/jwt/claims": {                                    "x-hasura-user-id": input.userId,                                    "x-hasura-default-role": "user",                                    "x-hasura-allowed-roles": ["user"],                                }                            };
                            return originalImplementation.createNewSession(input);                        },                    };                }            },        })    ]});

import (    "net/http"
    "github.com/supertokens/supertokens-golang/recipe/session"    "github.com/supertokens/supertokens-golang/recipe/session/sessmodels"    "github.com/supertokens/supertokens-golang/supertokens")
func main() {    supertokens.Init(supertokens.TypeInput{        RecipeList: []supertokens.Recipe{            session.Init(&sessmodels.TypeInput{                Jwt: &sessmodels.JWTInputConfig{                    Enable: true,                },                Override: &sessmodels.OverrideStruct{                    Functions: func(originalImplementation sessmodels.RecipeInterface) sessmodels.RecipeInterface {
                        originalCreateNewSession := *originalImplementation.CreateNewSession
                        (*originalImplementation.CreateNewSession) = func(res http.ResponseWriter, userID string, accessTokenPayload, sessionData map[string]interface{}, userContext supertokens.UserContext) (sessmodels.SessionContainer, error) {                            if accessTokenPayload == nil {                                accessTokenPayload = map[string]interface{}{}                            }
                            hasuraClaims := map[string]interface{}{                                "x-hasura-user-id":       userID,                                "x-hasura-default-role":  "user",                                "x-hasura-allowed-roles": []string{"user"},                            }
                            accessTokenPayload["https://hasura.io/jwt/claims"] = hasuraClaims
                            return originalCreateNewSession(res, userID, accessTokenPayload, sessionData, userContext)                        }
                        return originalImplementation                    },                },            }),        },    })}

from supertokens_python import init, InputAppInfofrom supertokens_python.recipe import sessionfrom supertokens_python.recipe.session.interfaces import RecipeInterfacefrom typing import Dict, Union, Any
def override_functions(original_implementation: RecipeInterface):    original_implementation_create_new_session = original_implementation.create_new_session
    async def create_new_session(request: Any, user_id: str,                                 access_token_payload: Union[None, Dict[str, Any]],                                 session_data: Union[None, Dict[str, Any]], user_context: Dict[str, Any]):
        if access_token_payload is None:            access_token_payload = {}
        access_token_payload['https://hasura.io/jwt/claims'] = {            "x-hasura-user-id": user_id,            "x-hasura-default-role":  'user',            "x-hasura-allowed-roles": ['user'],        }
        return await original_implementation_create_new_session(request, user_id, access_token_payload, session_data, user_context)
    original_implementation.create_new_session = create_new_session    return original_implementation
init(    app_info=InputAppInfo(api_domain="...", app_name="...", website_domain="..."),    framework='...',     recipe_list=[        session.init(            jwt=session.JWTConfig(enable=True),            override=session.InputOverrideConfig(                functions=override_functions            )        )    ])

4) Configure Hasura environment variables#

info

Read the official documentation to know about setting the JWT secret environment variable on Hasura

To use JWT based authentication, Hasura requires setting environment variables when configuring your app. With SuperTokens this can be done in 2 ways:

Using the JWKS endpoint#

When configuring Hasura, you can set the jwk_url property.

{    "jwk_url": "{apiDomain}/{apiBasePath}/jwt/jwks.json"}

You can get the jwks URL for your backend by using the method explained here

Using a key string#

Hasura let's you provide a PEM string in the configuration. Refer to this page to know how to get a public key as a string, you can then use that key string in the Hasura config:

{    "type": "RS256",    "key": "CERTIFICATE_STRING",}

5) Making requests to Hasura#

a) Getting the JWT on the frontend#

Refer to this page to know how to read the JWT

b) Making HTTP requests#

import axios from "axios";
async function makeRequest() {  let url = "...";  let jwt = "..."; // Refer to step 5.a  let response = await axios.get(url, {    headers: {      "Authorization": `Bearer ${jwt}`,    },  });}

During Local development#

If you are using Hasura cloud and testing your backend APIs in your local environment, JWT verification will fail because Hasura will not be able to query the JWKS endpoint (because the cloud can not query your local environment i.e localhost, 127.0.0.1).

To solve this problem you will need to expose your locally hosted backend APIs to the internet. For example you can use ngrok:

Configure Hasura to use the {ngrokURL}/{apiBasePath}/jwt/jwks.json as the JWKS endpoint (explained in step 4)
Configure SuperTokens to use {ngrokURL}/{apiBasePath} as the custom issuer URL (refer to this page to know more)