clerk/javascript

NextJS protected admin folder "can't detect usage of authMiddleware()"

rnnyrk opened this issue · 4 comments

Preliminary Checks

Reproduction

https://github.com/rnnyrk/rnnyrk-kitchen-sink

Publishable key

pk_test_Y2FyaW5nLWVlbC0yNS5jbGVyay5hY2NvdW50cy5kZXYk

Description

I'm trying to implement Clerq for the first time, but running into an issue after precisely following the provided guides.
I have to following folder structure, where I only want the whole /admin folder to be protected.
The signup and login pages are working. But the admin environment gives the following error as I use auth(). Not using that hook makes the admin area visible instead of protected.

Screenshot 2024-03-22 at 13 02 46

The middleware is in the src folder and the admin regex example is straight from the docs.

Some similar examples are available, but the straight forward answers from that issues are not working or already implementen (like moving the middleware into the source folder).

Expected behavior:

Able to use auth() in the protected environment

Actual behavior:

Error: Clerk: auth() was called but Clerk can't detect usage of authMiddleware(). Please ensure the following

Environment

System:
    OS: macOS 14.3.1
    CPU: (11) arm64 Apple M3 Pro
    Memory: 443.91 MB / 18.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.10.0 - ~/.nvm/versions/node/v20.10.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v20.10.0/bin/npm
    pnpm: 8.15.4 - /opt/homebrew/bin/pnpm
    bun: 1.0.29 - /opt/homebrew/bin/bun
    Watchman: 2024.01.22.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 123.0.6312.58
    Safari: 17.3.1
  npmPackages:
    next: 14.1.14 => 14.1.4
    @clerk/nextjs: 4.29.9 => 4.29.9
    turbo: latest => 1.13.0

Hi!

Thanks for creating the issue. The GitHub repository you provided isn't accessible to me, is it private?
Nevertheless, the provided screenshot shows a project that is far beyond a minimal reproduction and we'll have a hard time tracking down the exact issue with so many other moving parts. Once we have access to a repository with a minimal reproduction we'll be able to take another look.

Thanks for using Clerk!

@LekoArts I do understand what your saying. The issue is that in the minimal reproduction (https://codesandbox.io/p/devbox/lively-paper-wv65tp) the issue doesn't exists. Although inside my application it does and there is no way to debug or tell why this is happening since the provided error is super general and doesn't point to anything related to the issue.

Hello @rnnyrk!

From the screenshot you have provided I can see that you have misspelled middleware.ts with middeware.ts, so this is probably the case you are getting this error, can you try renaming the file and check if it will work?

@octoper i feel so stupid 😢