search

supabase / auth-helpers

A collection of framework specific Auth utilities for working with Supabase.
https://supabase.github.io/auth-helpers/
MIT License
893 stars 240 forks source link

AuthUnknownError when using @supabase/ssr + gotrue locally #724

Closed paulm17 closed 4 months ago

paulm17 commented 5 months ago

Hey all.

I'm running gotrue locally and after seeding with a user. I'm able to get a response using:

import { AuthClient } from '@supabase/auth-js'

const auth = new AuthClient({ url: 'http://127.0.0.1:9999' })
const { data } = await auth.signUp({ email: values.email, password: values.password });
  user: {
    id: '1024b57c-5761-47c7-b92c-7eec800b2131',
    aud: 'authenticated',
    role: '',
    email: 'abba@gmail.com',
    phone: '',
    confirmation_sent_at: '2024-01-23T16:34:42.345896Z',
    app_metadata: { provider: 'email', providers: [Array] },
    user_metadata: {},
    identities: [],
    created_at: '2024-01-23T16:34:42.345896Z',
    updated_at: '2024-01-23T16:34:42.345896Z'
  },
  session: null

However, when I try @supabase/ssr:

const supabase = createSupabaseServerClient();

const { data, error } = await supabase.auth.signUp({
      email: values.email,
      password: values.password,
})

I get the error:

error AuthUnknownError: Unexpected token p in JSON at position 4
     at handleError (webpack-internal:///(action-browser)/../../node_modules/.pnpm/@supabase+gotrue-js@2.62.2/node_modules/@supabase/gotrue-js/dist/module/lib/fetch.js:41:15)
     at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
     at async _handleRequest (webpack-internal:///(action-browser)/../../node_modules/.pnpm/@supabase+gotrue-js@2.62.2/node_modules/@supabase/gotrue-js/dist/module/lib/fetch.js:93:9)
     at async _request (webpack-internal:///(action-browser)/../../node_modules/.pnpm/@supabase+gotrue-js@2.62.2/node_modules/@supabase/gotrue-js/dist/module/lib/fetch.js:73:18)
     at async SupabaseAuthClient.signUp (webpack-internal:///(action-browser)/../../node_modules/.pnpm/@supabase+gotrue-js@2.62.2/node_modules/@supabase/gotrue-js/dist/module/GoTrueClient.js:236:23)
     at async onSubmit (webpack-internal:///(action-browser)/./src/app/(auth)/signup/actions.ts:20:33)
     at async /Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:39:406
     at async t0 (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:38:5773)
     at async rh (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:39:23636)
     at async doRender (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:1391:30)
     at async cacheEntry.responseCache.get.routeKind (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:1552:28)
     at async DevServer.renderToResponseWithComponentsImpl (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:1460:28)
     at async DevServer.renderPageComponent (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:1843:24)
     at async DevServer.renderToResponseImpl (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:1881:32)
     at async DevServer.pipeImpl (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:909:25)
     at async NextNodeServer.handleCatchallRenderRequest (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/next-server.js:266:17)
     at async DevServer.handleRequestImpl (/Users/paul/development/src/github/auth/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:805:17) {
   __isAuthError: true,
   status: undefined,
   originalError: SyntaxError: Unexpected token p in JSON at position 4
       at JSON.parse (<anonymous>)
       at parseJSONFromBytes (node:internal/deps/undici/undici:6662:19)
       at successSteps (node:internal/deps/undici/undici:6636:27)
       at node:internal/deps/undici/undici:1236:60
       at node:internal/process/task_queues:140:7
       at AsyncResource.runInAsyncScope (node:async_hooks:203:9)
       at AsyncResource.runMicrotask (node:internal/process/task_queues:137:8)
       at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
 }

full code:

import {cookies} from "next/headers";
import {createServerClient} from "@supabase/ssr";

export function createSupabaseServerClient() {
  return createServerClient(
    process.env.SUPABASE_URL!,
    process.env.SUPABASE_KEY!,
    {
      cookies: {
        get(name: string) {
          // return cookie with the 'name' here    
          return cookies().get(name)?.value;      
        },
        set(name: string, value, options) {
          // set cookie
          cookies().set(name, value, options);
        },
        remove(name: string, options) {
          // remove cookie
          cookies().set(name, "", options);
        },       
      },
    }
  );  
};
paulm17 commented 5 months ago

I saw that the endpoints in the gotrue logs where different with each client being used...

Thankfully I'm running gotrue locally from source. I changed the endpoint to match and now it works. So now I know where the issue is 😄

For the endpoints:

auth-js, defaults to / @supabase/ssr, defaults to /auth/v1

Found the issue in supabase-js: https://github.com/supabase/supabase-js/blob/4362b3fb2a2cc93ab56ee253e733e226dcf85d8b/src/SupabaseClient.ts#L76

this.authUrl = ${_supabaseUrl}/auth/v1

J0 commented 4 months ago

Hey @paulm17

Thanks for reporting the issue and reverting back with a fix, going to close now but feel free to revert back if there are still q concerns.