401 Unauthorized – status: interstitial, reason: cross-origin-referrer

[fanckush]

Preliminary Checks

• I have reviewed the documentation: https://clerk.com/docs

• I have searched for existing issues: https://github.com/clerkinc/javascript/issues

• This issue is not a question, general help request, or anything other than a bug report directly related to Clerk. Please ask questions in our Discord community: https://clerk.com/discord.

Reproduction / Replay Link

https://github.com/fanckush/clerk-bug-error-401/tree/main

Publishable key

pk_test_aW50ZW5zZS1naG91bC00OS5jbGVyay5hY2NvdW50cy5kZXYk

Description

Steps to reproduce:

1. Install dependencies (yarn install)
2. run dev server (yarn dev)
3. open localhost:3000
4. either you get an infinite refresh loop. or press the button
5. check the console and network tab and notice the 401 error

The error seems to be coming from

import { ClerkExpressWithAuth } from "@clerk/clerk-sdk-node";

interestingly, if instead of running the dev server you build the app and preview it, then the error is gone
to try this out

1. yarn build to build the web app
2. yarn preview to serve it

Environment

System:
    OS: macOS 14.0
    CPU: (8) arm64 Apple M1 Pro
    Memory: 188.38 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.4.0 - /opt/homebrew/bin/node
    Yarn: 3.3.0 - /opt/homebrew/bin/yarn
    npm: 9.7.2 - /opt/homebrew/bin/npm
    pnpm: 8.5.1 - /opt/homebrew/bin/pnpm
  Browsers:
    Brave Browser: 117.1.58.124
    Safari: 17.0
  npmPackages:
    @clerk/clerk-sdk-node: ^4.12.5 => 4.12.5 
    @nuxt/devtools: latest => 0.8.3 
    nuxt: ^3.7.3 => 3.7.3

[fanckush]

closing as this turned out to be an issue where nuxtis incorrectly setting the x-forwarded-proto header to an invalid value which in turn is causing clerk to give this error