Kinde•4mo ago

How can I get the X username or the user ID of the user when they are signing up using X

Hey, I've implemented sign in using X through Kinde, but it is essential that I get the username for our product, how can I achieve this?

18 Replies

Kunal Bagaria•4mo ago

@Admin

Daniel_Kinde•4mo ago

Hi @Kunal Bagaria , Could you let me know what SDK you're using please?

Kunal Bagaria•4mo ago

the nextjs latest app router sdk @kinde-oss/kinde-auth-nextjs @Admin just pinging back here

onderay•4mo ago

To include the username in the token when using X (formerly Twitter) for sign-in through Kinde with NextJS, you will need to ensure that the username is part of the claims in the token. Here are the steps you can follow: Configure X (Twitter) Sign-In: Ensure that you have correctly set up X as a social sign-in option in your Kinde application. This includes setting up the necessary credentials and redirect URIs. Modify Token Claims: You need to customize the token claims to include the username. This can typically be done in the Kinde dashboard where you configure the identity provider settings. Ensure that the username is included in the claims that are returned by X and passed through to the token. Update NextJS Application: In your NextJS application, you can access the token and extract the username. Here is an example of how you can do this using the Kinde NextJS SDK:

    import { getKindeServerSession } from "@kinde-oss/kinde-auth-nextjs/server";

    export async function GET() {
        const { getUser } = getKindeServerSession();
        const user = await getUser();

        if (!user || user == null || !user.id) {
            throw new Error("Something went wrong with authentication" + user);
        }

        // Extract the username from the token
        const username = user.username; // Ensure 'username' is part of the token claims

        // Use the username as needed in your application
        console.log("Username:", username);

        return NextResponse.redirect("http://localhost:3000/");
    }

    import { getKindeServerSession } from "@kinde-oss/kinde-auth-nextjs/server";

    export async function GET() {
        const { getUser } = getKindeServerSession();
        const user = await getUser();

        if (!user || user == null || !user.id) {
            throw new Error("Something went wrong with authentication" + user);
        }

        // Extract the username from the token
        const username = user.username; // Ensure 'username' is part of the token claims

        // Use the username as needed in your application
        console.log("Username:", username);

        return NextResponse.redirect("http://localhost:3000/");
    }

Testing: After making these changes, test the sign-in process to ensure that the username is correctly included in the token and can be accessed in your NextJS application.

Kunal Bagaria•4mo ago

there is where I need to enable it right?

Kunal Bagaria•4mo ago

I've saved it although it shows 0 properties enabled

Kunal Bagaria•4mo ago

{
  family_name: 'Bagaria',
  given_name: 'Kunal',
  picture: '[redacted]',
  email: '[redacted]',
  id: 'kp_e293179f53b44cebb5d7e2314ede03d5',
  properties: {
    city: undefined,
    industry: undefined,
    job_title: undefined,
    middle_name: undefined,
    postcode: undefined,
    salutation: undefined,
    state_region: undefined,
    street_address: undefined,
    street_address_2: undefined
  }
}

{
  family_name: 'Bagaria',
  given_name: 'Kunal',
  picture: '[redacted]',
  email: '[redacted]',
  id: 'kp_e293179f53b44cebb5d7e2314ede03d5',
  properties: {
    city: undefined,
    industry: undefined,
    job_title: undefined,
    middle_name: undefined,
    postcode: undefined,
    salutation: undefined,
    state_region: undefined,
    street_address: undefined,
    street_address_2: undefined
  }
}

and this is what I get from the getUser method from the server session @Andre @ Kinde a bit urgent would love some help

onderay•4mo ago

Sorry about this, I will need get a team member to triple check what is happening.

Oli - Kinde•4mo ago

Hey @Kunal Bagaria, Sorry that you are experiencing this issue. Are you able to inspect the ID token and check that the X (twitter) social identity is included in the claims of the ID token after a user authenticates with X (twitter)?

Kunal Bagaria•4mo ago

Hi Oli, I've inspected the ID token as well the data does not have a username parameter either

{
  at_hash: '[redacted]',
  aud: [ '[redacted]' ],
  auth_time: 1719250162,
  azp: '[redacted]',
  email: '[redacted]',
  email_verified: true,
  exp: 1720511959,
  family_name: 'Bagaria',
  given_name: 'Kunal',
  iat: 1720508359,
  iss: '[redacted]',
  jti: '[redacted]',
  name: 'Kunal Bagaria',
  org_codes: [ 'org_b8a09815ffa' ],
  picture: 'https://pbs.twimg.com/profile_images/1527161976127770624/oGO8jrdN.jpg',
  rat: 1719250162,
  sub: 'kp_e293179f53b44cebb5d7e2314ede03d5',
  updated_at: 1720419965
}

{
  at_hash: '[redacted]',
  aud: [ '[redacted]' ],
  auth_time: 1719250162,
  azp: '[redacted]',
  email: '[redacted]',
  email_verified: true,
  exp: 1720511959,
  family_name: 'Bagaria',
  given_name: 'Kunal',
  iat: 1720508359,
  iss: '[redacted]',
  jti: '[redacted]',
  name: 'Kunal Bagaria',
  org_codes: [ 'org_b8a09815ffa' ],
  picture: 'https://pbs.twimg.com/profile_images/1527161976127770624/oGO8jrdN.jpg',
  rat: 1719250162,
  sub: 'kp_e293179f53b44cebb5d7e2314ede03d5',
  updated_at: 1720419965
}

either username, or the twitter user id works for me, but i'm not sure how to extract either of those I'm using the Next App Router SDK

Kunal Bagaria•4mo ago

and this is still enabled

Kunal Bagaria•4mo ago

@Oli - Kinde pinging again

Oli - Kinde•4mo ago

Hi @Kunal Bagaria, I will look into this issue wiht my team tomorrow. Hey @Kunal Bagaria, My team mate who is an expert in this area was offline today but they will be online tomorrow. I will get them to look into this issue tomorrow. Apologies for the inconvenience here.

Kunal Bagaria•4mo ago

hey thanks oli, we’re in a launch timeline so would really appreciate if it could be resolved quickly

Oli - Kinde•4mo ago

Do you have a rough ETA for your launch?

Kunal Bagaria•4mo ago

we need to send it to our investors before this week ends 😬

Oli - Kinde•4mo ago

My team mate is already looking into this issue. Im sure we can get it sorted today 🤞

viv (kinde)•4mo ago

Hi @Kunal Bagaria - can I check if you toggle on organizations under that, and check the ID token, if you see an array of orgs? If not, I suspect your token may be cached - would you know how long the lifetime is? Some additional information here (https://docs.kinde.com/authenticate/manage-authentication/sync-with-kinde/#:~:text=For%20optimum%20performance%20our%20tokens,the%20UI%20or%20via%20API) but you could try calling this (https://kinde.com/api/docs/#refresh-user-claims-and-invalidate-cache) endpoint POST /api/v1/users/{user_id}/refresh_claims to manually disable cache.
Also just checking if you're on the latest Nextjs app router version? I believe there was a change that went out 2 months back re: custom claims and caching.

Kinde docs

Keep your product in sync with Kinde

Our developer tools provide everything you need to get started with Kinde.

Gaming

Programming

How can I get the X username or the user ID of the user when they are signing up using X