mav•10mo ago

Custom Auth integration with Privy

Hey everyone! I'm trying to get a custom auth integration working, but can't quite crack it. I use Privy.io web3 auth and this is what I came up with so far:

 export function usePrivyAuth() {
    const { getAccessToken, authenticated, ready } = usePrivy();

    const fetchAccessToken = useCallback(
        async ({ forceRefreshToken = true }: { forceRefreshToken: boolean }) => {
            if (forceRefreshToken) {
                const accessToken = await getAccessToken();
                if (accessToken) {
                    const verifyAuthToken = await fetch('/api/auth/verifyToken', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                        },
                        body: JSON.stringify({
                            accessToken: accessToken,
                        }),
                    });

                    if (verifyAuthToken.status === 200) {
                        console.log('Privy authenticated?', authenticated);
                        return accessToken;
                    } else {
                        console.log('Request failed', verifyAuthToken.status);
                        return null;
                    }
                } else {
                    console.log("Couldn't get a token");
                    return null;
                }
            } else {
                return await getAccessToken();
            }
        },
        [getAccessToken, authenticated]
    );

    return useMemo(
        () => ({
            isLoading: !ready,
            isAuthenticated: authenticated,
            fetchAccessToken,
        }),
        [authenticated, ready, fetchAccessToken]
    );
}

 export function usePrivyAuth() {
    const { getAccessToken, authenticated, ready } = usePrivy();

    const fetchAccessToken = useCallback(
        async ({ forceRefreshToken = true }: { forceRefreshToken: boolean }) => {
            if (forceRefreshToken) {
                const accessToken = await getAccessToken();
                if (accessToken) {
                    const verifyAuthToken = await fetch('/api/auth/verifyToken', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                        },
                        body: JSON.stringify({
                            accessToken: accessToken,
                        }),
                    });

                    if (verifyAuthToken.status === 200) {
                        console.log('Privy authenticated?', authenticated);
                        return accessToken;
                    } else {
                        console.log('Request failed', verifyAuthToken.status);
                        return null;
                    }
                } else {
                    console.log("Couldn't get a token");
                    return null;
                }
            } else {
                return await getAccessToken();
            }
        },
        [getAccessToken, authenticated]
    );

    return useMemo(
        () => ({
            isLoading: !ready,
            isAuthenticated: authenticated,
            fetchAccessToken,
        }),
        [authenticated, ready, fetchAccessToken]
    );
}

Here, authenticated always returns false even though console.log('Privy authenticated?', authenticated); returns true after I verify the user token. The isLoading: !ready works as well. Any suggestions?

6 Replies

mavOP•10mo ago

To add more context, I'm following the debugging steps and I get the Authenticated status in my browser with the correct token. The JWT decoder looks correct as well, it all matches with the Settings > Authentication menu in Convex. My authConfig:

const authConfig = {
    providers: [
        {
            domain: 'https://privy.io',
            applicationID: 'clvxzus1102hr132wssmha2tr',
        },
    ],
};

const authConfig = {
    providers: [
        {
            domain: 'https://privy.io',
            applicationID: 'clvxzus1102hr132wssmha2tr',
        },
    ],
};

mavOP•10mo ago

Michal Srb•10mo ago

What error are you getting? (you should be getting AuthError message in the websocket messages). I'm suspicious of the iss not being a full URL.

mavOP•10mo ago

In my ws I get "Could not parse as id token". In my Privy dashboard I have an endpoint like https://auth.privy.io/api/v1/apps/clvxzus1102hr132wssmha2tr/jwks.json but it doesn't work either, exact same behaviour and errors.

Michal Srb•10mo ago

The Convex backend is following OpenID strictly. Usually the endpoints for JWKS are under .well-known/. I would guess this JWT setup doesn't follow the OpenID spec.

mavOP•10mo ago

Understood, thank you for your help, Michael! Reaching out to their team.

Custom Auth integration with Privy

Did you find this page helpful?