Umut (Hope) YILDIRIM•14mo ago

Custom Auth with Kinde

Hi, I'm trying to connect Kinde with Convex. After following docs I'm getting "No auth provider found matching the given token" error. I first tried Next.JS same error then react. Either Am i missing something. Next.JS Repo: https://github.com/umuthopeyildirim/kindeconvex React Repo: https://github.com/umuthopeyildirim/react-kinde-convex Any help is appreciated! After debugging I will also add this to convex/react repo as a helper.

GitHub

GitHub - umuthopeyildirim/kindeconvex

Contribute to umuthopeyildirim/kindeconvex development by creating an account on GitHub.

GitHub

GitHub - umuthopeyildirim/react-kinde-convex: Starter kit for React...

Starter kit for React with Kinde. Contribute to umuthopeyildirim/react-kinde-convex development by creating an account on GitHub.

17 Replies

Michal Srb•14mo ago

Hey @Umut (Hope) YILDIRIM, great work! The React setup looks good. Can you try to grab the JWT token from the sync websocket Authenticate message and pasting it into https://jwt.io/ to check that it aligns with your VITE_KINDE_CLIENT_ID / VITE_KINDE_DOMAIN ?

JWT.IO

JSON Web Tokens are an open, industry standard RFC 7519 method for representing claims securely between two parties.

Michal Srb•14mo ago

Umut (Hope) YILDIRIMOP•14mo ago

So after putting my auth token to debugger this is the output(I will destroy this app so no worries);

{
  "aud": [],
  "azp": "6557e00e8a2948c8956a82b425c40259",
  "billing": {
    "has_payment_details": false,
    "org_entitlements": null,
    "plan": {
      "code": null,
      "created_on": null,
      "has_trial_period": null,
      "invoice_due_on": null,
      "name": null,
      "plan_charge_type": null,
      "trial_expires_on": null
    }
  },
  "exp": 1699611988,
  "iat": 1699525588,
  "iss": "https://luminarylightning.kinde.com",
  "jti": "5f38345e-d0a0-4f7c-b955-69fc66f7e028",
  "org_code": "org_db449a11ad6",
  "permissions": [],
  "scp": [
    "openid",
    "profile",
    "email",
    "offline"
  ],
  "sub": "kp_e7a1e11a5d1e4253b9d4755b3e8b72fd"
}

{
  "aud": [],
  "azp": "6557e00e8a2948c8956a82b425c40259",
  "billing": {
    "has_payment_details": false,
    "org_entitlements": null,
    "plan": {
      "code": null,
      "created_on": null,
      "has_trial_period": null,
      "invoice_due_on": null,
      "name": null,
      "plan_charge_type": null,
      "trial_expires_on": null
    }
  },
  "exp": 1699611988,
  "iat": 1699525588,
  "iss": "https://luminarylightning.kinde.com",
  "jti": "5f38345e-d0a0-4f7c-b955-69fc66f7e028",
  "org_code": "org_db449a11ad6",
  "permissions": [],
  "scp": [
    "openid",
    "profile",
    "email",
    "offline"
  ],
  "sub": "kp_e7a1e11a5d1e4253b9d4755b3e8b72fd"
}

My env config;

VITE_KINDE_CLIENT_ID=6557e00e8a2948c8956a82b425c40259
VITE_KINDE_DOMAIN=https://luminarylightning.kinde.com
VITE_KINDE_REDIRECT_URL=http://localhost:3000
VITE_KINDE_LOGOUT_URL=http://localhost:3000

# Deployment used by `npx convex dev`
CONVEX_DEPLOYMENT=dev:formal-bass-14 # team: umuthopeyildirim, project: kindeconvex
VITE_CONVEX_URL=https://formal-bass-14.convex.cloud

VITE_KINDE_CLIENT_ID=6557e00e8a2948c8956a82b425c40259
VITE_KINDE_DOMAIN=https://luminarylightning.kinde.com
VITE_KINDE_REDIRECT_URL=http://localhost:3000
VITE_KINDE_LOGOUT_URL=http://localhost:3000

# Deployment used by `npx convex dev`
CONVEX_DEPLOYMENT=dev:formal-bass-14 # team: umuthopeyildirim, project: kindeconvex
VITE_CONVEX_URL=https://formal-bass-14.convex.cloud

Michal Srb•14mo ago

What our server does is: For each claim that the token represents, find the audience, and find the application_id in the audiences. Is it possible that Kinde isn't OIDC compliant? Actually looking at the snippet of your token your aud field indeed doesn't include the application ID. Here's an example payload from Clerk:

{
  "aud": "convex",
  "azp": "http://localhost:5173",
  "email": "srb@convex.dev",
  "email_verified": true,
  "exp": 1699561235,
 ... etc

{
  "aud": "convex",
  "azp": "http://localhost:5173",
  "email": "srb@convex.dev",
  "email_verified": true,
  "exp": 1699561235,
 ... etc

Umut (Hope) YILDIRIMOP•14mo ago

Thank you so much It works now 😄

Michal Srb•14mo ago

It would be awesome to get this integrated into Convex. I'm also curious what you @Umut (Hope) YILDIRIM like about Kinde over Clerk/Auth0. Thanks!

Umut (Hope) YILDIRIMOP•14mo ago

I would love to help. Kinde currently offers 7500 free active users instead of 5000 and they are a new company so I'm just trying them out.

Umut (Hope) YILDIRIMOP•14mo ago

@Michal Srb , I've opened a PR here: https://github.com/get-convex/convex-js/pull/5. I may have created a bit of a mess 😅. Any assistance or feedback on this would be greatly appreciated!

GitHub

Build software better, together

GitHub is where people build software. More than 100 million people use GitHub to discover, fork, and contribute to over 330 million projects.

CodingWithJamal•14mo ago

i never heard of then

Umut (Hope) YILDIRIMOP•14mo ago

I came across some advertisements on Twitter and Instagram and was immediately intrigued. As someone who loves learning and testing new things, trying it out was a no-brainer for me. However, I noticed that they currently lack some SaaS integrations. I also use Clerk and Auth.js.

CodingWithJamal•14mo ago

I use auth.js + convex, had to write my own custom adapter though but it works really well

David•10mo ago

@CodingWithJamal Would you be able to share this code? At the moment I need to use a WordPress site as an identity provider (I'm using a WordPress plugin to do this). To integrate with Convex I'm not sure if the best approach is to try and do this directly with the WP identity provider or via something like Auth.js and add the WP identity provider as a custom Auth.js provider. I'm pretty new to deep diving into auth stuff so my knowledge is limited. Any help is appreciated.

CodingWithJamal•10mo ago

sure, so this is a link to my convex auth.js adapter pr code

CodingWithJamal•10mo ago

heres a link https://github.com/ThatGuyJamal/next-auth/blob/ConvexDB-Adapter/packages/adapter-convex/src/index.ts

GitHub

next-auth/packages/adapter-convex/src/index.ts at ConvexDB-Adapter ...

Authentication for the Web. Contribute to ThatGuyJamal/next-auth development by creating an account on GitHub.

David•10mo ago

Thank you! @CodingWithJamal This looks great. I don't suppose you've considered asking Auth.js if they'd consider adding this as an official db adapter?

CodingWithJamal•10mo ago

Yeah, i would like that but i wanted the convex team approval first and i have not seen a reply yet from them

David•10mo ago

Oh, right. Well, hopefully that will be approved! @Michal Srb +1 for getting an official Convex adapter submitted for Auth.js! 🙂

Custom Auth with Kinde

Did you find this page helpful?