36 replies

Help debugging custom JWT auth

Hi, I am trying to use custom JWT auth with my convex database. I have an endpoint that generates a valid JWT (see screenshot below) and I have configured the

auth.config.ts

auth.config.ts

auth.config.ts

auth.config.ts in the convex directory. However, the onChange callback for

setAuth

setAuth

setAuth

setAuth is always returning false.

The convex instance is a local development instance created with

npx convex dev --local --once

npx convex dev --local --once

npx convex dev --local --once

npx convex dev --local --once, so should be able to access the well-known?

convex/auth.config.ts

convex/auth.config.ts

convex/auth.config.ts

convex/auth.config.ts:

import { config } from "$lib/shared/config";

export default {
    providers: [
        {
            type: "customJwt",
            applicationId: config.domain,
            issuer: "http://localhost:5173",
            jwks: "http://localhost:5173/.well-known/jwks.json",
            algorithm: "RS256"
        }
    ]
};

import { config } from "$lib/shared/config";

export default {
    providers: [
        {
            type: "customJwt",
            applicationId: config.domain,
            issuer: "http://localhost:5173",
            jwks: "http://localhost:5173/.well-known/jwks.json",
            algorithm: "RS256"
        }
    ]
};

import { config } from "$lib/shared/config";

export default {
    providers: [
        {
            type: "customJwt",
            applicationId: config.domain,
            issuer: "http://localhost:5173",
            jwks: "http://localhost:5173/.well-known/jwks.json",
            algorithm: "RS256"
        }
    ]
};

import { config } from "$lib/shared/config";

export default {
    providers: [
        {
            type: "customJwt",
            applicationId: config.domain,
            issuer: "http://localhost:5173",
            jwks: "http://localhost:5173/.well-known/jwks.json",
            algorithm: "RS256"
        }
    ]
};

setAuth call:

client.setAuth(
    async ({ forceRefreshToken }) => {
        let token = localStorage.getItem(TOKEN_KEY);
        if (!forceRefreshToken && token) {
            return token;
        }

        const response = await api.request(api.v1.auth.token, {
            method: "GET",
            input: {}
        });

        console.log(`Fetch token (force: ${forceRefreshToken}), response:`, response);

        if (!response.ok) {
            console.error("Failed to fetch a new token", response);
            return null;
        }

        token = response.value.token;
        if (token) {
            localStorage.setItem(TOKEN_KEY, token);
        }

        return token;
    },
    (isAuthenticated) => {
        console.log("Auth changed, authenticated:", isAuthenticated); // always false
        authenticated = isAuthenticated;
    }
);

client.setAuth(
    async ({ forceRefreshToken }) => {
        let token = localStorage.getItem(TOKEN_KEY);
        if (!forceRefreshToken && token) {
            return token;
        }

        const response = await api.request(api.v1.auth.token, {
            method: "GET",
            input: {}
        });

        console.log(`Fetch token (force: ${forceRefreshToken}), response:`, response);

        if (!response.ok) {
            console.error("Failed to fetch a new token", response);
            return null;
        }

        token = response.value.token;
        if (token) {
            localStorage.setItem(TOKEN_KEY, token);
        }

        return token;
    },
    (isAuthenticated) => {
        console.log("Auth changed, authenticated:", isAuthenticated); // always false
        authenticated = isAuthenticated;
    }
);

client.setAuth(
    async ({ forceRefreshToken }) => {
        let token = localStorage.getItem(TOKEN_KEY);
        if (!forceRefreshToken && token) {
            return token;
        }

        const response = await api.request(api.v1.auth.token, {
            method: "GET",
            input: {}
        });

        console.log(`Fetch token (force: ${forceRefreshToken}), response:`, response);

        if (!response.ok) {
            console.error("Failed to fetch a new token", response);
            return null;
        }

        token = response.value.token;
        if (token) {
            localStorage.setItem(TOKEN_KEY, token);
        }

        return token;
    },
    (isAuthenticated) => {
        console.log("Auth changed, authenticated:", isAuthenticated); // always false
        authenticated = isAuthenticated;
    }
);

client.setAuth(
    async ({ forceRefreshToken }) => {
        let token = localStorage.getItem(TOKEN_KEY);
        if (!forceRefreshToken && token) {
            return token;
        }

        const response = await api.request(api.v1.auth.token, {
            method: "GET",
            input: {}
        });

        console.log(`Fetch token (force: ${forceRefreshToken}), response:`, response);

        if (!response.ok) {
            console.error("Failed to fetch a new token", response);
            return null;
        }

        token = response.value.token;
        if (token) {
            localStorage.setItem(TOKEN_KEY, token);
        }

        return token;
    },
    (isAuthenticated) => {
        console.log("Auth changed, authenticated:", isAuthenticated); // always false
        authenticated = isAuthenticated;
    }
);

Any help is appreciated!!

Help debugging custom JWT auth

Similar Threads

Similar Threads

Similar Threads