Kinde•3mo ago

Using Kinde with Angular Capacitor and NodeJS

Hi. I am using a package called kinde-angular and got it to work on a mobile app. this is my redirect url customurlscheme://callback?code=1234&scope=openid%20profile%20email%20offline&state=dummystatedetails. However once I am redirected to my app i am unable to get the app to handle the callback using this function which will not allow my app to change the auth state to true.

9 Replies

Daniel_Kinde•3mo ago

Are you able to share some example code or raise an issue on the SDK github?

FarisOP•3mo ago

Will share shortly not sure if i did something wrong but im just curious if theres and api endpoint that i can pass the code and state in the payload to verify that would be handy Also just wanted to know. I am using nodejs written in typescript for my api. How can i validate my backend for each requests made? Do i have to create another project in kinde? Any update anyone?

Oli - Kinde•3mo ago

Hey @Faris, Apologies, Daniel has a personal matter he needs to attend. I will help you out in the meantime. Yes, you can validate requests using the Kinde TypeScript SDK for your Node.js backend written in TypeScript. Here's how you can set it up: 1. First, install the Kinde TypeScript SDK:

npm i @kinde-oss/kinde-typescript-sdk

npm i @kinde-oss/kinde-typescript-sdk

2. Then, create a Kinde client instance in your application:

import {createKindeServerClient, GrantType} from "@kinde-oss/kinde-typescript-sdk";

const kindeClient = createKindeServerClient(GrantType.AUTHORIZATION_CODE, {
   authDomain: "https://<your_kinde_subdomain>.kinde.com",
   clientId: "<your_kinde_client_id>",
   clientSecret: "<your_kinde_client_secret>",
   redirectURL: "http://localhost:3000/callback",
   logoutRedirectURL: "http://localhost:3000"
  });

import {createKindeServerClient, GrantType} from "@kinde-oss/kinde-typescript-sdk";

const kindeClient = createKindeServerClient(GrantType.AUTHORIZATION_CODE, {
   authDomain: "https://<your_kinde_subdomain>.kinde.com",
   clientId: "<your_kinde_client_id>",
   clientSecret: "<your_kinde_client_secret>",
   redirectURL: "http://localhost:3000/callback",
   logoutRedirectURL: "http://localhost:3000"
  });

3. To validate each request, you can use the isAuthenticated method provided by the SDK:

const isAuthenticated = await kindeClient.isAuthenticated(sessionManager); // Boolean: true or false
  if (isAuthenticated) {
   // Need to implement, e.g: call an api, etc...
  } else {
   // Need to implement, e.g: redirect user to sign in, etc..
  }

const isAuthenticated = await kindeClient.isAuthenticated(sessionManager); // Boolean: true or false
  if (isAuthenticated) {
   // Need to implement, e.g: call an api, etc...
  } else {
   // Need to implement, e.g: redirect user to sign in, etc..
  }

4. You can also check for specific permissions using the getPermission method:

const permission = await kindeClient.getPermission(sessionManager, "create:todos");
  if (permission.isGranted) {
   ...
  }

const permission = await kindeClient.getPermission(sessionManager, "create:todos");
  if (permission.isGranted) {
   ...
  }

Remember to replace the placeholder values in the client configuration with your actual Kinde subdomain, client ID, client secret, and redirect URLs. Let me know if you have any further questions.

FarisOP•3mo ago

hi thank you for the response. cookies is kinda new thing for me because i got it to work for kinde but are u able to guide me for the code below?

let store: Record<string, unknown> = {};

const sessionManager: SessionManager = {
  async getSessionItem(key: string) {
    return store[key];
  },
  async setSessionItem(key: string, value: unknown) {
    store[key] = value;
  },
  async removeSessionItem(key: string) {
    delete store[key];
  },
  async destroySession() {
    store = {};
  }
};

let store: Record<string, unknown> = {};

const sessionManager: SessionManager = {
  async getSessionItem(key: string) {
    return store[key];
  },
  async setSessionItem(key: string, value: unknown) {
    store[key] = value;
  },
  async removeSessionItem(key: string) {
    delete store[key];
  },
  async destroySession() {
    store = {};
  }
};

I want to store in cookie and send to my angular app in production but seems to be unable to make it work

Oli - Kinde•3mo ago

Hey @Faris,

I want to store in cookie and send to my angular app in production but seems to be unable to make it work

Are you able to elaborate further on what you want to do? Knowing what you are trying to achieve will help my team and I guide you.

FarisOP•3mo ago

Hi Oli. The above code i sent works but only on local environment as its storing in the store variable. However I am still trying to implement a way i can use in production where users session are stored in database or through cookies

Oli - Kinde•3mo ago

Hey @Faris, Thanks for your quick reply. For a production-ready solution, you would need to replace the store variable with a more robust storage solution, such as a database or a distributed cache system. The exact implementation would depend on your specific infrastructure and requirements. I would suggest asking other communities for guidance on this in the #💬┃general channel.

FarisOP•3mo ago

I see alright thanks a lot

Oli - Kinde•3mo ago

My pleasure.

Gaming

Programming

Using Kinde with Angular Capacitor and NodeJS