K
Kinde5mo ago
bnln

Add audience using Nuxt Module

I looks like this may not be implemented, but I could very well have messed something up at my end. However, when I add an env variable NUXT_KINDE_AUDIENCE I don't see anything in my aud claims. I'm testing using the Kinde Management API, with a slightly modify version of the Nuxt Starter project.
8 Replies
onderay
onderay5mo ago
Sorry in the delay @bnln , I will get @Daniel_Kinde to help out here as he is experienced with Nuxt
Daniel_Kinde
Daniel_Kinde5mo ago
Hi @bnln , thanks for reaching out. could you give me details on how you're accessing the management API? 1. Have you enabled the Kinde management API on the application you're using? 2. How are you requesting the token to get the audience?
bnln
bnln5mo ago
Hi @Daniel_Kinde 1. Yes, I double checked to make sure that I'd enabled the API in the app. I also tried with another API as well just to make sure it was nothing specific to the Kinde management API. 2. I've set the env variable NUXT_KINDE_AUDIENCE to be the API audience. (Following a suggestion from the @Ai – Kinde ) In the token though, I only see aud: [], so I'm wondering if this has been implement for NUXT, as I couldn't find it in the docs. Thanks for the assistance!
Daniel_Kinde
Daniel_Kinde5mo ago
Hi @bnln , Check here: https://discord.com/channels/1070212618549219328/1204727161794338849 There is a solution for using the management api within Nuxt Let me know if you have any issues.
bnln
bnln5mo ago
@Daniel_Kinde Actually I'm just working on the client side at the moment. My use of the management API was just an example, but essentially I just wanting to add audiences One "nice to have" would be a getClaim() method. I'd like to get the orgName, though I see getPermissions() returns the orgCode. Otherwise, would you recommend decoding the token and storing it with Pinia? This is the composable that I'm using in the meantime;
import { jwtVerify, createRemoteJWKSet } from "jose";

export const useClaim = async (
token: string,
claim: string
): Promise<string | undefined> => {
const authDomain = "https://<MyOrgName>.kinde.com";

try {
const JWKS = createRemoteJWKSet(new URL(`${authDomain}/.well-known/jwks`));

const { payload } = await jwtVerify(token, JWKS, {
issuer: authDomain,
});
const claimValue = payload[claim];
if (typeof claimValue === "string") return claimValue;
} catch (e) {
console.log(e);
return undefined;
}
};
import { jwtVerify, createRemoteJWKSet } from "jose";

export const useClaim = async (
token: string,
claim: string
): Promise<string | undefined> => {
const authDomain = "https://<MyOrgName>.kinde.com";

try {
const JWKS = createRemoteJWKSet(new URL(`${authDomain}/.well-known/jwks`));

const { payload } = await jwtVerify(token, JWKS, {
issuer: authDomain,
});
const claimValue = payload[claim];
if (typeof claimValue === "string") return claimValue;
} catch (e) {
console.log(e);
return undefined;
}
};
Daniel_Kinde
Daniel_Kinde5mo ago
I have been working today to add improvements to the Nuxt Module. I will be addressing the Audiance as part of these changes.
bnln
bnln4mo ago
@Daniel_Kinde thanks 🙏
skywalker-kiwi#02131
Hey @Daniel_Kinde any update on where you have gotten to with this?