Kinde•10mo 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.

9 Replies

onderay•10mo ago

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

Daniel_Kinde•10mo 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?

bnlnOP•10mo 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•10mo 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.

bnlnOP•10mo 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•10mo ago

I have been working today to add improvements to the Nuxt Module. I will be addressing the Audiance as part of these changes.

bnlnOP•10mo ago

@Daniel_Kinde thanks 🙏

skywalker-kiwi#02131•6mo ago

Hey @Daniel_Kinde any update on where you have gotten to with this?

tammycore•3mo ago

@Daniel_Kinde, any update?

Gaming

Programming

Add audience using Nuxt Module