Can the PKCE access token be used to authenticate/authorize requests
Hi,
I am currently using clerk with a chrome extension. I want to switch to a service that supports Oauth PKCE flow. Clerk has it but the access token retrieved from this flow can not be used to authenticate requests.
Does Kinde support PKCE fully? Can the nextjs middleware automatically verify/permit requests with the PKCE access token?
36 Replies
In clerk, the access token isn't a JWT, is it the same in Kinde. I haven't implemented kinde yet because I wanted to make sure it fits my use case by reading the docs. But a few details are missing
Hi @sudhanshug,
Thanks for reaching out and good idea to get your questions answered before attempting to implement Kinde.
Yes, Kinde fully supports the PKCE extension for the Authorization Code flow.
As for your question about Next.js middleware, Kinde provides a Next.js SDK that simplifies the process of setting up authentication (verifying/permitting authentication requests) in your Next.js application - see the following guide: https://kinde.com/docs/developer-tools/nextjs-sdk/
Regarding the access token, Kinde does use JWTs for access tokens. These tokens are used to make authenticated requests on behalf of the user.
I hope this helps. Let me know if you have any other questions.
I am more than happy to give guidance on how to use Kinde for a Chrome Extension with NextJS. Let me know.
Kinde Docs
NextJS App Router SDK v2 - Developer tools - Help center
Our developer tools provide everything you need to get started with Kinde.
Do you have any docs/example project with a chrome extension + nextjs/express with PKCE?
thanks for the reply!
Also, does the Authorization Code flow also provides offline access (refresh token)?
Because this is for a chrome extension, the access token may expire in a while. I dont want the user to re-authorize again and again
I second the request for this example!
Nevermind, I figured out the refresh code situation – still nice to have an example
Hey @sudhanshug and @snusguy123,
Currently we don't have offical docs/examples for building a Chrome Extension with Kinde.
But, I can provide a high-level overview of how you might use Kinde with a Chrome Extension that uses Next.js and Express, with PKCE.
1. Setup Kinde: First, you need to setup Kinde for your application. You can follow the instructions provided in the Kinde Next.js SDK documentation.
2. Create a background script: In your Chrome Extension, you need to create a background script that will handle the authentication process. This script will open a new tab for the Kinde login page and listen for the redirect callback.
3. Handle the authentication: Once the user logs in, Kinde will redirect the user to a callback URL with the authorization code in the URL parameters. Your background script should listen for this redirect, extract the authorization code, and exchange it for an access token using Kinde's token endpoint.
4. Store the access token: After you get the access token, you can store it in the Chrome Extension's local storage. You can then use this token to make authenticated requests to your Next.js API.
5. Use the access token: In your Next.js API routes, you can use Kinde's Next.js SDK to verify the access token and authenticate the request.
Remember, this is a high-level overview and the actual implementation might require additional steps based on your application's specific needs. Also, ensure to handle the tokens securely to prevent any security risks.
Let me know if you have further questions on this.
Sounds like you figured out how to handle offline access, but Ill provide details here anyways so others can reference it.
The Authorization Code flow can provide offline access if you include the
offline scope in your authentication request. This will return a refresh token along with the access token. You can use the refresh token to obtain a new access token when the current one expires, without requiring the user to re-authenticate. This is particularly useful for maintaining long-running sessions in both back-end and web apps.
Here's an example of how to include the offline scope in your request:
Remember to replace <yoursubdomain>, your_client_id, and your_redirect_uri with your actual values.
For more information, you can refer to the Kinde documentation on refresh tokens.Thanks!
Here is a gist I created with a working OAuth setup for chrome extension
Gist
Kinde OAuth PKCE setup for chrome extension using plasmo
Kinde OAuth PKCE setup for chrome extension using plasmo - background.ts
Actually, I am not able to get this to work completely. In nextjs, when I call this endpoint with the Authorization Bearer header, I am not able to retrieve the user. It always returns null
@Oli - Kinde, the ENVs are correctly set up
I went through your nextjs sdk, I dont think this is secure https://github.com/kinde-oss/kinde-auth-nextjs/blob/main/src/utils/pageRouter/isTokenValid.js#L4
It seems that you are not verifying the signature of the jwt
GitHub
kinde-auth-nextjs/src/utils/pageRouter/isTokenValid.js at main · ki...
Kinde NextJS SDK - authentication for server rendered apps - kinde-oss/kinde-auth-nextjs
if you are, please point me to it
Can I get an update on this. Kind of important
Hey @sudhanshug,
Apologies for the delay.
If the user is not authenticated, it returns a 401 status code. If the user is authenticated, it logs the user's information and returns it as a JSON response.
If you're not able to retrieve the user and it always returns null, it could be due to a few reasons:
1. The user is not authenticated: The
isAuthenticated function checks if the user is authenticated. If the user is not authenticated, the function will return false, and the getUser function will not be called.
2. The JWT token is not included in the request headers: The getKindeServerSession function retrieves the user's information from the JWT token included in the request headers. If the JWT token is not included in the headers, the function will not be able to retrieve the user's information.
3. The JWT token is invalid or expired: If the JWT token is invalid or expired, the getKindeServerSession function will not be able to retrieve the user's information.
To debug this issue, you could add some logging to your function to check the value of isAuthenticated and the request headers. This might give you some clues about what's going wrong.
I understand your concern about the security of the JWT validation in the Next.js SDK. The function you're referring to, isTokenValid, is a utility function that checks if the token exists and if it's not expired. It doesn't verify the signature of the JWT.
The actual verification of the JWT signature is handled by the Kinde server when you make a request to a protected resource. The server uses the public key corresponding to the private key that signed the JWT to verify the signature. This ensures that the token was issued by Kinde and hasn't been tampered with.if I am getting this right, the nextjs sdk hits the kinde server on every request to a protected resource?
Yes, you're correct. The Next.js SDK does communicate with the Kinde server on every request to a protected resource. This is done to validate the user's session and ensure they have the necessary permissions to access the resource. The
getKindeServerSession function, which is used in the Next.js SDK, retrieves the user's session data from the Kinde server. This includes the user's authentication status, permissions, and other user-related data. If the user is not authenticated or does not have the necessary permissions, the request to the protected resource will be denied. This helps to maintain the security and integrity of your application.