clerk / javascript

Official JavaScript repository for Clerk authentication
https://clerk.com
MIT License
1.15k stars 259 forks source link

404 if I want to sign up #2211

Closed FleetAdmiralJakob closed 11 months ago

FleetAdmiralJakob commented 11 months ago

Preliminary Checks

Reproduction / Replay Link

https://github.com/FleetAdmiralJakob/new-twitter-clone

Publishable key

pk_test_c3BsZW5kaWQtaW1wYWxhLTg5LmNsZXJrLmFjY291bnRzLmRldiQ

Description

Steps to reproduce:

  1. https://postparrot.roessner.tech/
  2. Click on the sign in button
  3. Click on sign up
  4. Try to sign up or sign in with any method you want

Expected behavior:

It should log you in

Actual behavior:

You get a 404: Page not found

Environment

System:
    OS: Windows 11 10.0.22631
    CPU: (12) x64 AMD Ryzen 5 5600X 6-Core Processor
    Memory: 8.73 GB / 31.93 GB
  Binaries:
    Node: 20.9.0 - D:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 10.2.3 - D:\Program Files\nodejs\npm.CMD
    pnpm: 8.10.5 - ~\AppData\Local\pnpm\pnpm.EXE
  Browsers:
    Edge: Chromium (119.0.2151.58)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    @clerk/nextjs: ^4.27.2 => 4.27.2
    @clerk/themes: ^1.7.9 => 1.7.9
    @t3-oss/env-nextjs: ^0.7.0 => 0.7.1
    @tanstack/react-query: ^4.32.6 => 4.36.1
    @trpc/client: ^10.44.0 => 10.44.0
    @trpc/next: ^10.44.0 => 10.44.0
    @trpc/react-query: ^10.44.0 => 10.44.0
    @trpc/server: ^10.44.0 => 10.44.0
    @types/eslint: ^8.44.2 => 8.44.7
    @types/node: ^20.0.0 => 20.9.3
    @types/react: ^18.2.33 => 18.2.37
    @types/react-dom: ^18.2.14 => 18.2.15
    @typescript-eslint/eslint-plugin: ^6.3.0 => 6.12.0
    @typescript-eslint/parser: ^6.3.0 => 6.12.0
    @vercel/postgres: ^0.5.1 => 0.5.1
    autoprefixer: ^10.4.14 => 10.4.16
    dotenv-cli: ^7.3.0 => 7.3.0
    drizzle-kit: ^0.20.4 => 0.20.4
    drizzle-orm: ^0.29.0 => 0.29.0
    eslint: ^8.47.0 => 8.54.0
    eslint-config-next: ^14.0.0 => 14.0.3
    next: ^14.0.0 => 14.0.3
    pg: ^8.11.3 => 8.11.3
    postcss: ^8.4.27 => 8.4.31
    prettier: ^3.0.0 => 3.1.0
    prettier-plugin-tailwindcss: ^0.5.1 => 0.5.7
    react: 18.2.0 => 18.2.0
    react-dom: 18.2.0 => 18.2.0
    server-only: ^0.0.1 => 0.0.1
    superjson: ^2.0.0 => 2.2.1
    tailwindcss: ^3.3.3 => 3.3.5
    tsx: ^4.3.0 => 4.3.0
    typescript: ^5.1.6 => 5.3.2
    zod: ^3.22.4 => 3.22.4
panteliselef commented 11 months ago

I just run the flow in the website u sent and worked.

I created an account from the Sign Up component and both the sign in page and sign up page are accessible.

FleetAdmiralJakob commented 11 months ago

https://github.com/clerk/javascript/assets/77451351/ab08d885-4bf6-4313-8327-fdf9993d2ca3

FleetAdmiralJakob commented 11 months ago

Weird, if I try to sign in / sign up it does not work. Can you say with which O Auth service you tried it?

Btw. I tried it also with email and it does also not work there

jescalan commented 11 months ago

I was able to reproduce this on the given reproduction link - we'll look into this one soon.

FleetAdmiralJakob commented 11 months ago

I was able to reproduce this on the given reproduction link - we'll look into this one soon.

Thank you!!! ❤️

tmilewski commented 11 months ago

Hey @FleetAdmiralJakob!

Thank you for the reproduction!

It appears that the reason you're receiving a 404 is that the paths are missing catch-all segments.

By adding the catch-all segments, your paths will ultimately look like this:

/app/sign-ip/[[...sign-in]]/page.tsx
/app/sign-up/[[...sign-up]]/page.tsx

This should solve your issues! 👍


Here are some documentation links for more information:


I'm going to close this but feel free to re-open, if you're still experiencing issues.

FleetAdmiralJakob commented 11 months ago

Thank you