feat(nextjs): Allows access to `request` object to dynamically define `clerkMiddleware` options by LauraBeatris · Pull Request #4160 · clerk/javascript

LauraBeatris · 2024-09-13T11:12:49Z

Description

Resolves SDK-1932

Allows to dynamically access the Next.js request object when providing options to clerkMiddleware:

export default clerkMiddleware((auth) => {
  return NextResponse.next();
}, (req) => {
 return ({
    domain: req.nextUrl.host,
  })
});

Another example of a use case where Clerk keys could be fetched based on tenant:

export default clerkMiddleware((auth, req) => {
  return NextResponse.next();
}, (req) => {
  const tenant = getTenant(req)
  const { publishableKey, secretKey } = getClerkKeys(tenant)

  return {
    publishableKey,
    secretKey,
  }
})

This is another improvement for the "Next.js dynamic keys" feature. So far we propagate secretKey and publishableKey from the middleware to the application server allowing those keys to be provided statically during runtime, but we don't support dynamically resolving per request as in the example above.

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-09-13T11:12:53Z

🦋 Changeset detected

Latest commit: 16edd29

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

clerk-cookie · 2024-09-13T19:39:53Z

Hey @LauraBeatris - the snapshot version command generated the following package versions:

Package	Version
@clerk/astro	1.3.3-snapshot.v525ef29
@clerk/backend	1.12.0-snapshot.v525ef29
@clerk/chrome-extension	1.3.5-snapshot.v525ef29
@clerk/clerk-js	5.22.0-snapshot.v525ef29
@clerk/elements	0.15.3-snapshot.v525ef29
@clerk/clerk-expo	2.2.11-snapshot.v525ef29
@clerk/express	0.1.0-snapshot.v525ef29
@clerk/fastify	1.0.42-snapshot.v525ef29
@clerk/localizations	3.0.2-snapshot.v525ef29
@clerk/nextjs	5.5.3-snapshot.v525ef29
@clerk/clerk-react	5.9.0-snapshot.v525ef29
@clerk/remix	4.2.26-snapshot.v525ef29
@clerk/clerk-sdk-node	5.0.39-snapshot.v525ef29
@clerk/shared	2.8.0-snapshot.v525ef29
@clerk/tanstack-start	0.4.2-snapshot.v525ef29
@clerk/testing	1.2.22-snapshot.v525ef29
@clerk/themes	2.1.30-snapshot.v525ef29
@clerk/types	4.21.0-snapshot.v525ef29

Tip: Use the snippet copy button below to quickly install the required packages.
@clerk/astro

npm i @clerk/astro@1.3.3-snapshot.v525ef29 --save-exact

@clerk/backend

npm i @clerk/backend@1.12.0-snapshot.v525ef29 --save-exact

@clerk/chrome-extension

npm i @clerk/chrome-extension@1.3.5-snapshot.v525ef29 --save-exact

@clerk/clerk-js

npm i @clerk/clerk-js@5.22.0-snapshot.v525ef29 --save-exact

@clerk/elements

npm i @clerk/elements@0.15.3-snapshot.v525ef29 --save-exact

@clerk/clerk-expo

npm i @clerk/clerk-expo@2.2.11-snapshot.v525ef29 --save-exact

@clerk/express

npm i @clerk/express@0.1.0-snapshot.v525ef29 --save-exact

@clerk/fastify

npm i @clerk/fastify@1.0.42-snapshot.v525ef29 --save-exact

@clerk/localizations

npm i @clerk/localizations@3.0.2-snapshot.v525ef29 --save-exact

@clerk/nextjs

npm i @clerk/nextjs@5.5.3-snapshot.v525ef29 --save-exact

@clerk/clerk-react

npm i @clerk/clerk-react@5.9.0-snapshot.v525ef29 --save-exact

@clerk/remix

npm i @clerk/remix@4.2.26-snapshot.v525ef29 --save-exact

@clerk/clerk-sdk-node

npm i @clerk/clerk-sdk-node@5.0.39-snapshot.v525ef29 --save-exact

@clerk/shared

npm i @clerk/shared@2.8.0-snapshot.v525ef29 --save-exact

@clerk/tanstack-start

npm i @clerk/tanstack-start@0.4.2-snapshot.v525ef29 --save-exact

@clerk/testing

npm i @clerk/testing@1.2.22-snapshot.v525ef29 --save-exact

@clerk/themes

npm i @clerk/themes@2.1.30-snapshot.v525ef29 --save-exact

@clerk/types

npm i @clerk/types@4.21.0-snapshot.v525ef29 --save-exact

LauraBeatris · 2024-09-13T20:50:03Z

Some upcoming docs changes: clerk/clerk-docs#1508

LauraBeatris

@royanger mentioned that there was an edge function error when deployment this branch's snapshot to Vercel prod, I'll make another round of tests here

LauraBeatris · 2024-09-16T18:14:13Z

!snapshot

clerk-cookie · 2024-09-16T18:17:43Z

Hey @LauraBeatris - the snapshot version command generated the following package versions:

Package	Version
@clerk/astro	1.3.4-snapshot.v7c05c51
@clerk/backend	1.13.0-snapshot.v7c05c51
@clerk/chrome-extension	1.3.6-snapshot.v7c05c51
@clerk/clerk-js	5.22.1-snapshot.v7c05c51
@clerk/clerk-expo	2.2.12-snapshot.v7c05c51
@clerk/express	0.1.1-snapshot.v7c05c51
@clerk/fastify	1.0.43-snapshot.v7c05c51
@clerk/localizations	3.0.3-snapshot.v7c05c51
@clerk/nextjs	5.6.0-snapshot.v7c05c51
@clerk/remix	4.2.27-snapshot.v7c05c51
@clerk/clerk-sdk-node	5.0.40-snapshot.v7c05c51
@clerk/tanstack-start	0.4.3-snapshot.v7c05c51
@clerk/testing	1.3.1-snapshot.v7c05c51

Tip: Use the snippet copy button below to quickly install the required packages.
@clerk/astro

npm i @clerk/astro@1.3.4-snapshot.v7c05c51 --save-exact

@clerk/backend

npm i @clerk/backend@1.13.0-snapshot.v7c05c51 --save-exact

@clerk/chrome-extension

npm i @clerk/chrome-extension@1.3.6-snapshot.v7c05c51 --save-exact

@clerk/clerk-js

npm i @clerk/clerk-js@5.22.1-snapshot.v7c05c51 --save-exact

@clerk/clerk-expo

npm i @clerk/clerk-expo@2.2.12-snapshot.v7c05c51 --save-exact

@clerk/express

npm i @clerk/express@0.1.1-snapshot.v7c05c51 --save-exact

@clerk/fastify

npm i @clerk/fastify@1.0.43-snapshot.v7c05c51 --save-exact

@clerk/localizations

npm i @clerk/localizations@3.0.3-snapshot.v7c05c51 --save-exact

@clerk/nextjs

npm i @clerk/nextjs@5.6.0-snapshot.v7c05c51 --save-exact

@clerk/remix

npm i @clerk/remix@4.2.27-snapshot.v7c05c51 --save-exact

@clerk/clerk-sdk-node

npm i @clerk/clerk-sdk-node@5.0.40-snapshot.v7c05c51 --save-exact

@clerk/tanstack-start

npm i @clerk/tanstack-start@0.4.3-snapshot.v7c05c51 --save-exact

@clerk/testing

npm i @clerk/testing@1.3.1-snapshot.v7c05c51 --save-exact

LauraBeatris · 2024-09-16T20:27:06Z

!snapshot

clerk-cookie · 2024-09-16T20:34:05Z

Hey @LauraBeatris - the snapshot version command generated the following package versions:

Package	Version
@clerk/astro	1.3.4-snapshot.v5e85d2f
@clerk/backend	1.13.0-snapshot.v5e85d2f
@clerk/chrome-extension	1.3.6-snapshot.v5e85d2f
@clerk/clerk-js	5.22.1-snapshot.v5e85d2f
@clerk/clerk-expo	2.2.12-snapshot.v5e85d2f
@clerk/express	0.1.1-snapshot.v5e85d2f
@clerk/fastify	1.0.43-snapshot.v5e85d2f
@clerk/localizations	3.0.3-snapshot.v5e85d2f
@clerk/nextjs	5.6.0-snapshot.v5e85d2f
@clerk/remix	4.2.27-snapshot.v5e85d2f
@clerk/clerk-sdk-node	5.0.40-snapshot.v5e85d2f
@clerk/tanstack-start	0.4.3-snapshot.v5e85d2f
@clerk/testing	1.3.1-snapshot.v5e85d2f

Tip: Use the snippet copy button below to quickly install the required packages.
@clerk/astro

npm i @clerk/astro@1.3.4-snapshot.v5e85d2f --save-exact

@clerk/backend

npm i @clerk/backend@1.13.0-snapshot.v5e85d2f --save-exact

@clerk/chrome-extension

npm i @clerk/chrome-extension@1.3.6-snapshot.v5e85d2f --save-exact

@clerk/clerk-js

npm i @clerk/clerk-js@5.22.1-snapshot.v5e85d2f --save-exact

@clerk/clerk-expo

npm i @clerk/clerk-expo@2.2.12-snapshot.v5e85d2f --save-exact

@clerk/express

npm i @clerk/express@0.1.1-snapshot.v5e85d2f --save-exact

@clerk/fastify

npm i @clerk/fastify@1.0.43-snapshot.v5e85d2f --save-exact

@clerk/localizations

npm i @clerk/localizations@3.0.3-snapshot.v5e85d2f --save-exact

@clerk/nextjs

npm i @clerk/nextjs@5.6.0-snapshot.v5e85d2f --save-exact

@clerk/remix

npm i @clerk/remix@4.2.27-snapshot.v5e85d2f --save-exact

@clerk/clerk-sdk-node

npm i @clerk/clerk-sdk-node@5.0.40-snapshot.v5e85d2f --save-exact

@clerk/tanstack-start

npm i @clerk/tanstack-start@0.4.3-snapshot.v5e85d2f --save-exact

@clerk/testing

npm i @clerk/testing@1.3.1-snapshot.v5e85d2f --save-exact

LauraBeatris · 2024-09-17T10:59:59Z

!snapshot

clerk-cookie · 2024-09-17T11:03:43Z

Hey @LauraBeatris - the snapshot version command generated the following package versions:

Package	Version
@clerk/astro	1.3.4-snapshot.ve940f7f
@clerk/backend	1.13.0-snapshot.ve940f7f
@clerk/chrome-extension	1.3.6-snapshot.ve940f7f
@clerk/clerk-js	5.22.1-snapshot.ve940f7f
@clerk/dev-cli	0.0.8-snapshot.ve940f7f
@clerk/clerk-expo	2.2.12-snapshot.ve940f7f
@clerk/express	0.1.1-snapshot.ve940f7f
@clerk/fastify	1.0.43-snapshot.ve940f7f
@clerk/localizations	3.0.3-snapshot.ve940f7f
@clerk/nextjs	5.6.0-snapshot.ve940f7f
@clerk/remix	4.2.27-snapshot.ve940f7f
@clerk/clerk-sdk-node	5.0.40-snapshot.ve940f7f
@clerk/tanstack-start	0.4.3-snapshot.ve940f7f
@clerk/testing	1.3.1-snapshot.ve940f7f

Tip: Use the snippet copy button below to quickly install the required packages.
@clerk/astro

npm i @clerk/astro@1.3.4-snapshot.ve940f7f --save-exact

@clerk/backend

npm i @clerk/backend@1.13.0-snapshot.ve940f7f --save-exact

@clerk/chrome-extension

npm i @clerk/chrome-extension@1.3.6-snapshot.ve940f7f --save-exact

@clerk/clerk-js

npm i @clerk/clerk-js@5.22.1-snapshot.ve940f7f --save-exact

@clerk/dev-cli

npm i @clerk/dev-cli@0.0.8-snapshot.ve940f7f --save-exact

@clerk/clerk-expo

npm i @clerk/clerk-expo@2.2.12-snapshot.ve940f7f --save-exact

@clerk/express

npm i @clerk/express@0.1.1-snapshot.ve940f7f --save-exact

@clerk/fastify

npm i @clerk/fastify@1.0.43-snapshot.ve940f7f --save-exact

@clerk/localizations

npm i @clerk/localizations@3.0.3-snapshot.ve940f7f --save-exact

@clerk/nextjs

npm i @clerk/nextjs@5.6.0-snapshot.ve940f7f --save-exact

@clerk/remix

npm i @clerk/remix@4.2.27-snapshot.ve940f7f --save-exact

@clerk/clerk-sdk-node

npm i @clerk/clerk-sdk-node@5.0.40-snapshot.ve940f7f --save-exact

@clerk/tanstack-start

npm i @clerk/tanstack-start@0.4.3-snapshot.ve940f7f --save-exact

@clerk/testing

npm i @clerk/testing@1.3.1-snapshot.ve940f7f --save-exact

LauraBeatris · 2024-09-17T13:35:37Z

@tmilewski

I've refactored this code since the edge runtime doesn't support AsyncLocalStorage enterWith method on their server polyfill.

We're still using run now, and referencing an Map as the store in-memory that gets updated during the request lifecycle once the options get defined.

tmilewski

👍, pending snapshot testing

LauraBeatris · 2024-09-17T13:54:30Z

+"@clerk/nextjs": minor
+---
+
+Allows access to request object to dynamically define `clerkMiddleware` options


I'll wait on merging this docs PR to reference it in the changeset here

panteliselef · 2024-09-17T16:56:28Z

@LauraBeatris
This is probably nit picking, but did we consider this ?

export default clerkMiddleware((auth, req) => {
  return NextResponse.next();
}, {
 domain: (req) => req.nextUrl.host,
})

LauraBeatris · 2024-09-17T17:21:51Z

@LauraBeatris This is probably nit picking, but did we consider this ?
export default clerkMiddleware((auth, req) => {
  return NextResponse.next();
}, {
 domain: (req) => req.nextUrl.host,
})

@panteliselef I think in that way we'll provide the request specifically to the domain option, or maybe to each option. If we provide req to all of the options in a single callback, it opens more space to application logic such as resolving tenants and then mapping to Clerk keys.

panteliselef · 2024-09-17T17:24:53Z

Cool, yeah i can see that from the other example u provided. Just wanted to double check.

… `clerkMiddleware` options (#4160)

LauraBeatris self-assigned this Sep 13, 2024

LauraBeatris changed the title ~~[DO NOT MERGE] Provide request object to options callback on clerkMiddleware~~ [DO NOT MERGE] Allow access to request object when providing clerkMiddleware options Sep 13, 2024

clerk-cookie added the nextjs label Sep 13, 2024

LauraBeatris changed the title ~~[DO NOT MERGE] Allow access to request object when providing clerkMiddleware options~~ [DO NOT MERGE] Allow access to request object when providing clerkMiddleware options Sep 13, 2024

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from b5396ec to aaf70d7 Compare September 13, 2024 14:22

LauraBeatris requested a review from dstaley September 13, 2024 14:22

clerk-cookie added the playground label Sep 13, 2024

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from aaf70d7 to 8b05418 Compare September 13, 2024 14:24

clerk-cookie removed the playground label Sep 13, 2024

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from 8b05418 to 5d2fa46 Compare September 13, 2024 14:27

LauraBeatris requested a review from tmilewski September 13, 2024 17:02

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from 5d2fa46 to 525ef29 Compare September 13, 2024 18:15

LauraBeatris changed the title ~~[DO NOT MERGE] Allow access to request object when providing clerkMiddleware options~~ feat(nextjs): Allow access to request object when providing clerkMiddleware options Sep 13, 2024

LauraBeatris changed the title ~~feat(nextjs): Allow access to request object when providing clerkMiddleware options~~ feat(nextjs): Allows access to request object to dynamically define clerkMiddleware options Sep 13, 2024

LauraBeatris mentioned this pull request Sep 13, 2024

Add example on defining Clerk keys per tenant from clerkMiddleware clerk/clerk-docs#1508

Merged

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from 525ef29 to 079b322 Compare September 13, 2024 20:49

tmilewski approved these changes Sep 16, 2024

View reviewed changes

LauraBeatris marked this pull request as ready for review September 16, 2024 17:42

LauraBeatris commented Sep 16, 2024

View reviewed changes

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from 0d0a787 to 7c05c51 Compare September 16, 2024 18:13

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from 7c05c51 to cdbc0b0 Compare September 16, 2024 18:16

LauraBeatris marked this pull request as draft September 16, 2024 20:00

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from 5e85d2f to 3a1ab67 Compare September 16, 2024 21:01

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch 2 times, most recently from 91559f1 to e940f7f Compare September 17, 2024 10:59

LauraBeatris marked this pull request as ready for review September 17, 2024 13:32

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch 2 times, most recently from 70d2b11 to d1e8331 Compare September 17, 2024 13:36

tmilewski approved these changes Sep 17, 2024

View reviewed changes

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch 2 times, most recently from e0a67a7 to 139d064 Compare September 17, 2024 13:47

LauraBeatris added 7 commits September 17, 2024 10:49

Provide request object to options callback

7152aa4

Update ALS store to transition to resolved options

c437bf3

Add changeset

ce0ff2f

Extract callback to separate type defintion

8eafaec

Add try catch for debugging edge function issue

25e7aa3

Replace enterWith with run

5051512

Refactor store to use a in-memory reference

16edd29

LauraBeatris force-pushed the poc-clerk-middleware-req-options branch from 139d064 to 16edd29 Compare September 17, 2024 13:49

LauraBeatris commented Sep 17, 2024

View reviewed changes

panteliselef approved these changes Sep 17, 2024

View reviewed changes

LauraBeatris merged commit 1a4d410 into main Sep 17, 2024

LauraBeatris deleted the poc-clerk-middleware-req-options branch September 17, 2024 17:56

clerk-cookie mentioned this pull request Sep 17, 2024

ci(repo): Version packages #4183

Merged

izaaklauer mentioned this pull request Oct 1, 2024

feat(nextjs): Handle URL <> Session Org Mismatch in Middleware #3977

Merged

wobsoriano pushed a commit that referenced this pull request Feb 8, 2025

feat(nextjs): Allows access to request object to dynamically define…

42c0f94

… `clerkMiddleware` options (#4160)

LauraBeatris mentioned this pull request Feb 13, 2025

fix(nextjs): Update clerkMiddleware request callback to accept an async function #5147

Closed

9 tasks

Uh oh!

Conversation

LauraBeatris commented Sep 13, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Checklist

Type of change

Uh oh!

changeset-bot Bot commented Sep 13, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

clerk-cookie commented Sep 13, 2024

Uh oh!

LauraBeatris commented Sep 13, 2024

Uh oh!

LauraBeatris left a comment

Choose a reason for hiding this comment

Uh oh!

LauraBeatris commented Sep 16, 2024

Uh oh!

clerk-cookie commented Sep 16, 2024

Uh oh!

LauraBeatris commented Sep 16, 2024

Uh oh!

clerk-cookie commented Sep 16, 2024

Uh oh!

LauraBeatris commented Sep 17, 2024

Uh oh!

clerk-cookie commented Sep 17, 2024

Uh oh!

LauraBeatris commented Sep 17, 2024

Uh oh!

tmilewski left a comment

Choose a reason for hiding this comment

Uh oh!

LauraBeatris Sep 17, 2024

Choose a reason for hiding this comment

Uh oh!

panteliselef commented Sep 17, 2024

Uh oh!

LauraBeatris commented Sep 17, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

panteliselef commented Sep 17, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

LauraBeatris commented Sep 13, 2024 •

edited

Loading

changeset-bot Bot commented Sep 13, 2024 •

edited

Loading

LauraBeatris commented Sep 17, 2024 •

edited

Loading