Kinde•4mo ago

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.

7 Replies

onderay•4mo ago

Sorry in the delay @bnln , I will get @Daniel_Kinde to help out here as he is experienced with Nuxt

Daniel_Kinde•4mo 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•4mo 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•4mo 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•4mo 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•4mo 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•4mo ago

@Daniel_Kinde thanks 🙏

Gaming

Programming

Add audience using Nuxt Module