search

supabase / supabase-js

An isomorphic Javascript client for Supabase. Query your Supabase database, subscribe to realtime events, upload and download files, browse typescript examples, invoke postgres functions via rpc, invoke supabase edge functions, query pgvector.
https://supabase.com
MIT License
2.86k stars 220 forks source link

bug: Unable to use on NextJS v12.1.6 middleware with Edge Runtime #461

Closed christopherdro closed 1 year ago

christopherdro commented 1 year ago

Bug report

I recently tried updating to NextJS v12.1.6 and noticed that @supabase/supabase-js can no longer be used in Edge Functions. This is because native NodeJS APIs are not supported and it appears there are some dependencies of realtime-js that use these. Here is a look at the stack trace.

To Reproduce

Upgrade to NextJS 12.1.6 and try to use @supabase/supabase-js lib within a middleware function.

Additional context

Module not found: Can't resolve 'fs'

Import trace for requested module:
./node_modules/bufferutil/index.js
./node_modules/websocket/lib/WebSocketFrame.js
./node_modules/websocket/lib/websocket.js
./node_modules/websocket/index.js
./node_modules/@supabase/realtime-js/dist/module/RealtimeClient.js
./node_modules/@supabase/realtime-js/dist/module/index.js
./node_modules/@supabase/supabase-js/dist/module/index.js
./pages/api/v0/_middleware.ts

https://nextjs.org/docs/messages/module-not-found

You're using a Node.js module (fs) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
christopherdro commented 1 year ago

My current workaround is to use postgrest-js and remove cross-fetch from its dependencies. https://github.com/christopherdro/postgrest-js/commit/ee678bc8342211f0948c9ff828d285503eb54bf5

TheThirdRace commented 1 year ago

Actually, it's not just the realtime part that is affected. gotrue-js and postgres-js are both affected too.

Anything that import directly cross-fetch without using a dynamic import is gonna cause the problem I suppose.

natterstefan commented 1 year ago

I can verify that we are affected by this issue as well in one of your projects.

christrain91 commented 1 year ago

I also have this problem in the recently released Next.js 12.2 where middleware is now stable.

cagils commented 1 year ago

We are also affected by this in middleware. Should we expect a quick fix or try to find a workaround?

soedirgo commented 1 year ago

I believe this PR should fix the issue: https://github.com/vercel/next.js/pull/38234

In the meantime you can try using the Node.js-based API Routes instead of the Edge API Routes - you can do this by removing the runtime: 'experimental-edge' config.

Additionally we're also working on changing the way we package our client libs which should also fix this issue, though this may take some time.

feugy commented 1 year ago

The fix is still being discussed. For Edge API route, I recommend you to switch back to regular routes, as @soedirgo suggested. Fixing them may require a bit more time than fixing the middleware.

soedirgo commented 1 year ago

This should be resolved as of next@12.2.1 :)