javascript
javascript copied to clipboard
Paths with a "." are ignored by `authMiddleware()`
- [x] I have reviewed the documentation
- [x] I have searched for existing issues
- [x] I have ensured I am on the most recent version, and checked the changelog for that version
- [x] I have provided the Frontend API key from my application dashboard:
pk_test_dGVuZGVyLXF1YWdnYS0zMC5jbGVyay5hY2NvdW50cy5kZXYk - [x] I have provided a minimal reproduction or replay recording below
Brief Summary of the Issue
Next.js routes that include a . in their path are ignored by the authMiddleware(), even though . is a valid character to have within a URL path:
// `encodeURIComponent()` encodes characters such as ?, =, /, &, :
console.log(`paths/with/${encodeURIComponent('a.dot')}/are/okay`);
// Expected output: "paths/with/a.dot/are/okay"
This makes those pages error in Next.js if they use auth() in one of their Server Components.
Potential Solution
The Clerk's default proposed middleware config matcher doesn't match URL paths that include a . in their path.
Editing the matcher to allow . doesn't solve the issue, because the authMiddleware() also ignores those URL paths by default due to its DEFAULT_IGNORED_ROUTES.
Both the DEFAULT_CONFIG_MATCHER and the DEFAULT_IGNORED_ROUTES need to be updated in the authMiddleware() code and in the docs to allow for . in URL paths.
Minimal Reproduction or Replay
git clone https://github.com/IGassmann/dot-clerk-issuenpm installthe required dependencies.npm run devto launch the development server.- Open
http://localhost:3000 - Click in "View Demo"
- This will open
http://localhost:3000/dot.path/dashboardwhich will throw:
Error: Clerk: auth() was called but it looks like you aren't using `authMiddleware` in your middleware file. Please use `authMiddleware` and make sure your middleware matcher is configured correctly and it matches this route or page. See https://clerk.com/docs/quickstarts/get-started-with-nextjs
Package + Version
- [ ]
@clerk/clerk-js - [ ]
@clerk/clerk-react - [x]
@clerk/nextjs - [ ]
@clerk/remix - [ ]
@clerk/types - [ ]
@clerk/themes - [ ]
@clerk/localizations - [ ]
@clerk/clerk-expo - [ ]
@clerk/backend - [ ]
@clerk/clerk-sdk-node - [ ]
@clerk/shared - [ ]
@clerk/fastify - [ ]
@clerk/chrome-extension - [ ]
gatsby-plugin-clerk - [ ]
build/tooling/chore - [ ] other: