cloudflare plugin

[kennyyang2015]

Summary

Hi, I am a new developer trying to create a tool to visualize sql data tables, and to render and visualize the tables, I need a PostgreSQL URI so that i can connect to that database, but i am recieving this Error
" cloudflare:sockets
Module build failed: UnhandledSchemeError: Reading from "cloudflare:sockets" is not handled by plugins (Unhandled scheme).
Webpack supports "data:" and "file:" URIs by default.
You may need an additional plugin to handle "cloudflare:" URIs.
Import trace for requested module:
cloudflare:sockets "

have you guys ever received an error like this before and if so how did you solve it??
thanks in advance !

Additional information

No response

Example

No response

[ecumene]

This is a known issue with node-postgres

Working example (Next.js + Drizzle + Postgres + NextAuth) thanks to @leerob: https://github.com/vercel/nextjs-postgres-auth-starter

This occurred after a minor update to the pg package from v8.10.0 to v8.11.0 when the pg-cloudflare package was added as an optional dependency.
For now, we've reverted to v8.10.0.

Fix 1: In the meantime

package.json

-    "pg": "8.11.0",
+    "pg": "8.10.0",

yarn or npm i

Fix 2: Alternatively, patch the webpack config to ignore the cloudflare standard library

(Thanks, @greidinger-reis @enesgur)

next.config.js

/** @type {import('next').NextConfig} */
const nextConfig = {
    // ...
    webpack: (config, { webpack }) => {
        config.plugins.push(new webpack.IgnorePlugin({
            resourceRegExp: /^pg-native$|^cloudflare:sockets$/,
        }))

        return config
    },
}

export default nextConfig

Original answer:

Is this an error from NextJS? I got this as well, but my stacktrace appears to be getting the error from @neondatabase/serverless:

Module build failed: UnhandledSchemeError: Reading from "cloudflare:sockets" is not handled by plugins (Unhandled scheme).
Webpack supports "data:" and "file:" URIs by default.
You may need an additional plugin to handle "cloudflare:" URIs.
Import trace for requested module:
cloudflare:sockets
./node_modules/@neondatabase/serverless/index.js
./node_modules/drizzle-orm/neon-serverless/index.mjs
./app/schema/index.ts
./app/ai/page.tsx

Removing the dependency fixed things but that's obviously not ideal for everyone. I just used node-postgres. I think the issue is that the package comes with support for both Vercel Edge and Cloudflare Workers, which Next doesn't bundle correctly (?)

[joluhelo812]

Excellent, this solution worked for me, thank you very much

[loicknuchel]

Doing exactly the same thing as @kennyyang2015 (azimuttapp/azimutt#215) ^^
And got exactly the same error :/
Any tip beside removing the dependency?

[ecumene]

This package from Neon shims the node-postgres pg library to work on serverless runtimes such as Cloudflare Workers and Vercel Edge Functions — places where TCP sockets are not available — via a WebSocket proxy.

Do you need support for edge runtimes like Vercel Edge or Cloudflare Workers? If you don't you might get away with using node-postgres (pg) directly. Otherwise you should make an issue with that package (@neondatabase/serverless). The issue is that their bundle includes references to the Cloudflare workers standard lib (cloudflare:*) that are meant for workers only.

^^ Nevermind, you're not using Neon. What dependency is causing problems?

There might be a way to make Next tree shake (?) that out. Maybe someone else could comment about that.

[loicknuchel]

It's pg dependency (and its dependent ones).
Seems a known issue: brianc/node-postgres#2975
I fixed it by downgrading to 8.10 (instead of 8.11).

[ecumene]

I did a yarn upgrade earlier and my heart stopped when I seen the error again 😆

Downgrading fixed it too. :)

[rreeves8]

I am getting the same error using
"@neondatabase/serverless": "^0.4.1",
"kysely": "^0.24.2",

import { Pool } from "@neondatabase/serverless";

const pool = new Pool({ connectionString });
new Kysely({ dialect: new PostgresDialect({ pool }) });

anyone know a fix ?

[ecumene]

See my post from earlier, it might help 😊 @neondatabase/serverless is just a thin wrapper around node-postgres with edge function support. If you don't need edge support you could use pg directly (just make sure it's 8.10)

Otherwise, you might need to upgrade/downgrade neondatabase/serverless until it works again since it also relies on pg 8.11.

[johnpgr]

I'm having the same issue using
"@neondatabase/serverless": "^0.4.5",
"drizzle-orm": "^0.26.1",

import { Pool } from "@neondatabase/serverless"
import { drizzle } from "drizzle-orm/neon-serverless"
import { env } from "~/config/env.mjs"

const pool = new Pool({ connectionString: env.DB_URL })

export const db = drizzle(pool)

[enesgur]

I fixed that issue with the following webpack config:

    new webpack.IgnorePlugin({
      resourceRegExp: /^pg-native$|^cloudflare:sockets$/,
    }),

[ecumene]

Nice, this is also a good option in the meantime.

I wonder what this would look like using the NextJS Config format to configure webpack

[johnpgr]

This worked for me:

/** @type {import('next').NextConfig} */
const nextConfig = {
    // ...
    webpack: (config, { webpack }) => {
        config.plugins.push(new webpack.IgnorePlugin({
            resourceRegExp: /^pg-native$|^cloudflare:sockets$/,
        }))

        return config
    },
}

export default nextConfig

[ecumene]

Sweet! Added to my other answer.

[tmtron]

since this is an optional dependency that we don't use, we simply delete it via postinstall:

{
  "scripts": {
    "postinstall": "shx rm -rf node_modules/pg-cloudflare"
  }
}

• we use shx which makes it easy to execute code for windows and linux
• you could instead uise rimraf or an OS dependent command

[paulwongx]

In case anyone else comes across this thread. One option, at least in my case, is to recognize this happens when using the edge runtime with postgres, so not using edge fixed it for me

[rreeves8]

In case anyone else comes across this thread. One option, at least in my case, is to recognize this happens when using the edge runtime with postgres, so not using edge fixed it for me

Ya this isn't a solution, should work in edge

[leerob]

I ran into this as well, I have a working repo here with Next.js + Drizzle + Postgres + NextAuth: https://github.com/vercel/nextjs-postgres-auth-starter

[judygab]

@leerob can you share how did you resolve it? I have the same stack but can't get auth to work(everything else is fine)

[devdatkumar]

@leerob just checked your code, you ain't using the drizzle as a provider yet. check this
Try this:

 providers: [
   adapter: DrizzleAdapter(db)
 ],

and you will see the error.

[LegendNihal]

@leerob the prob arise when we use adapter with the exported db and using middleware in edge runtime.
theres no prob w credentials

[devdatkumar]

@leerob any fix?

[LegendNihal]

i tried using neon and it worked nicely. Postgres is not compatible with edge runtime is the problem.

[qqpann]

I encountered as well with Next.js + Drizzle + Postgres + NextAuth.
Is this issue even tracked by pg or postgres or drizzle-orm or next-auth?
(Probably mainly it's due to next-auth? since it's on beta)

[ghunkins]

I have this issue using Next.js + Drizzle + Postgres. No NextAuth, using Firebase. +1.

[luizkc]

same issue using Supabase for auth and DB provider

[ldenblyd]

someone fixed it ?

[ekakshjanweja]

I get this error only when I use the next-auth v5 middleware otherwise I don't face this error. I am using Nextjs, neon postgres, next auth and drizzle.

[aleksa-codes]

same issue here, the downgrade to v3.3 of postgres suggested below did not work for me

also could someone let me know if export const runtime = 'edge'; is needed in api/auth/[...nextauth] ? I added it once I got an error in cloudflare console, and then I started getting the error discussed here

another edit:
I also just tried switching postgres for NeonDB and now I am getting:
Module not found: Can't resolve 'crypto'

Very painful experience so far with server components, edge and next-auth.

[devdatkumar]

the issue is coming from latest version of postgres@3.4.3

[LegendNihal]

i tried using neon and it worked nicely. Postgres is not compatible with edge runtime is the problem.

[LegendNihal]

I haven't implemented nextauth config. All in auth.ts ... I switched to neon they support edge runtime. Postgres doesn't work with edge. I will link my rep when i upload to GitHub.

[devdatkumar]

could you share your auth.ts file here.

[LegendNihal]

auth.ts
import NextAuth from "next-auth"
import GitHub from "next-auth/providers/github"
import { DrizzleAdapter } from "@auth/drizzle-adapter"
import { db } from "./db"

export const {
handlers: { GET, POST },
auth,
} = NextAuth({
adapter: DrizzleAdapter(db),
providers: [GitHub],
})

db/index.ts
import { Pool } from '@neondatabase/serverless';
import { drizzle } from 'drizzle-orm/neon-serverless';

const client = new Pool({connectionString: process.env.DATABASE_URL!})
export const db = drizzle(client);

[devdatkumar]

thanks

[devdatkumar]

@LegendNihal Your config doesn't seems to be working
Could you share your repo code.

[luizkc]

Anyone still facing this?

I'm using postgres, not node-postgres (pg) and seeing this error. This is my db file:

import { drizzle } from "drizzle-orm/postgres-js";
import postgres from "postgres";

import * as schema from "./schema";

import { env } from "~/env";

const connectionString = env.DATABASE_URL;
const client = postgres(connectionString);
export const db = drizzle(client, { schema });

I also added the webpack snippet to my next.config.js and still see the error:

Any suggestions?

[LegendNihal]

I faced it too ... Its a postgres problem ... Not compatible with edge runtime. Use neon it works

[luizkc]

But can I still use that and work with Supabase?

[devdatkumar]

I don't think so, I tied with his config, didn't work 🗡️

[aleksa-codes]

facing the same issue here with Dirzzle and Supabase, has anyone fixed this?

[carloslfu]

Use this guide if you are using Supabase with the Vercel Edge Runtime: https://supabase.com/docs/guides/database/connecting-to-postgres/serverless-drivers#vercel-edge-functions.

From there. It's just setting the POSTGRES_URL correctly, and this is the code I use:

import { sql } from "@vercel/postgres"
import { drizzle } from "drizzle-orm/vercel-postgres"

import * as _schema from "./schema"

export const db = drizzle(sql, {
  schema: _schema,
})

This works! 🎉

[janghanp]

I just downgraded postgres version from 3.4.3 to 3.3 and it just works with DrizzleAdapter.

Below are the package versions that I am using:

"next": "14.1.0",
"next-auth": "^5.0.0-beta.5",
"pg": "^8.11.3",
"postgres": "3.3",

[devdatkumar]

interesting!

[Marknjo]

I may not know exactly why DrizzleAdapter with postgres 3.4* is leading to an this error, but overall, the current solution is to downgrade postgres to v3.3 as per @janghanp . All other prior solutions seems not to fix this problem.

[elbajo]

If you're using Authjs and you are running into this, there are two potential reasons:

• You are using the "database" session strategy for an adapter that is not compatible with Edge runtime (postgres in this case)
• You are correctly using the "jwt" session strategy but you are still importing the adapter in your middleware

Two solution:
A) Downgrade to 3.3 as mentioned above. Somehow postgres still works in runtime for 3.3.
B) Change your session strategy to "jwt" and split your auth.js file into auth.js + auth.config.js as indicated below.

auth.config.ts

import type { NextAuthConfig } from "next-auth";
import NextAuth from "next-auth";
 
export const authConfig { 
   prodivers: [YOUR_PROVIDERS],
   session: { strategy: "jwt" }
} satisfies NextAuthConfig;

export const { auth: middleware } = NextAuth(authConfig);

auth.js

import NextAuth from "next-auth";
import { authConfig } from "./auth.config";

export const { handlers, signIn, signOut, auth } = NextAuth({
    ...authConfig,
    adapter: YOUR_ADAPTER,
});

middleware.ts

import { middleware } from "./auth.config";
import { NextResponse } from "next/server";

export default middleware((req) => {
    console.log("Middleware is now running without importing my adapter, thanks elbajo");
});

Note that this approach won't work if you have an Email provider for now. See nextauthjs/next-auth#10632

You can read more in Authjs docs: https://authjs.dev/getting-started/migrating-to-v5#edge-compatibility

[renatoastra]

it worked for me! really thanks.

[cmoleka]

same this worked for me.

[douwepausma]

Currently non of these fixes are working for me. The latest suggestion, downgrading postgres to 3.4, also did not work. I will move away from middleware authentication for now. Hope to see an update on this issue at some point soon.

[eaoliver]

Nothing worked for me either.

[Monukumar777]

i forgot to remove these three line of code when i copy schema from auth.js :

// const connectionString = "postgres://postgres:postgres@localhost:5432/drizzle";
// const pool = postgres(connectionString, { max: 1 });

// export const db = drizzle(pool);

this is my mistake , check if you remove this lines from schema

[james-elicx]

Hello, we added support to be able to use the postgres library with cloudflare:sockets in cloudflare/next-on-pages#734 with a simple change in your Next.js config.

In your next.config.js, you will need to mark cloudflare:sockets as an external with the type commonjs for webpack. The correct way would be to mark it as import, but that is not possible due to the target environment Next.js uses. This will preserve it and turn it into a dynamic require statement at build time. In @cloudflare/next-on-pages, we'll then convert this back to an import statement when building the worker.

webpack: (config) => {
	config.externals.push('cloudflare:sockets');
	config.externalsType = 'commonjs';
})

[alyssadicarlo]

Hello, I had this cloudflare error which was fixed with the solutions from this thread. However, now I am having a similar problem with node.process. I downgraded postgres to 3.3 and included this in my next.config.mjs which I'm not actually sure that I am supposed to do:

webpack: (config) => {
    config.externals.push("node:process");
    config.externalsType = "commonjs";

    return config;
},

Now, I am getting the error:

ReferenceError: require is not defined from node:process. Any thoughts?

[raolak]

Had same issue with next, next-auth , drizzle and postgres (local docker) setup. All latest version of dependencies and postgres": "3.3" worked for me. Webpack fix didn't worked .

"drizzle-orm": "^0.29.5",
"next": "^14.2.3",
"next-auth": "^5.0.0-beta.18",
"postgres": "3.3",
"@auth/drizzle-adapter": "^1.1.0",

[daudln]

I encounter this error too with lucia auth validateRequest when I am trying to utilize it in next middleware.

Here is my middleware file

import {
  DEFAULT_LOGIN_REDIRECT,
  PUBLIC_ROUTES,
  AUTH_ROUTES,
  API_AUTH_PREFIX,
  LOGIN_REDIRECT,
} from "@/routes";
import { NextRequest } from "next/server";
import { validateRequest } from "@/lib/lucia";

export async function middleware(req: NextRequest) {
  const { user } = await validateRequest();

  const isLogin = true;
  const { nextUrl } = req;
  const isApiAuthRoute = nextUrl.pathname.startsWith(API_AUTH_PREFIX);
  const isAuthRoute = AUTH_ROUTES.includes(req.nextUrl.pathname);
  const isPublicRoute = PUBLIC_ROUTES.includes(req.nextUrl.pathname);
  if (isApiAuthRoute) {
    return;
  }

  if (isAuthRoute) {
    if (isLogin) {
      return Response.redirect(new URL(DEFAULT_LOGIN_REDIRECT, nextUrl));
    }
    return;
  }
  if (!isLogin && !isPublicRoute) {
    return Response.redirect(new URL(LOGIN_REDIRECT, nextUrl));
  }

  return;
}

export default middleware;

export const config = {
  matcher: ["/((?!.+\\.[\\w]+$|_next).*)", "/", "/(api|trpc)(.*)"],
};

Here is my validate validateRequest()

export const validateRequest = cache(
  async (): Promise<
    { user: User; session: Session } | { user: null; session: null }
  > => {
    const sessionId = cookies().get(lucia.sessionCookieName)?.value ?? null;
    if (!sessionId) {
      return {
        user: null,
        session: null,
      };
    }

    const result = await lucia.validateSession(sessionId);
    // next.js throws when you attempt to set cookie when rendering page
    try {
      if (result.session && result.session.fresh) {
        const sessionCookie = lucia.createSessionCookie(result.session.id);
        cookies().set(
          sessionCookie.name,
          sessionCookie.value,
          sessionCookie.attributes
        );
      }
      if (!result.session) {
        const sessionCookie = lucia.createBlankSessionCookie();
        cookies().set(
          sessionCookie.name,
          sessionCookie.value,
          sessionCookie.attributes
        );
      }
    } catch {}
    return result;
  }
);

Whenever I use this validateRequest() func in my middleware, I get an error

Module build failed: UnhandledSchemeError: Reading from "cloudflare:sockets" is not handled by plugins (Unhandled scheme). Webpack supports "data:" and "file:" URIs by default. You may need an additional plugin to handle "cloudflare:" URIs.

[MantasImb]

If anyone is still having this issue, you might have "postgres": "3.4.0" or later. Try downgrading to "postgres":"3.3.5", worked for me.

[joshbaskaran]

Thanks, downgrading seems to do the trick.

[paaauldev]

Worked, also remove edge if using

[JoaomdvFerreira]

I'm using "postgres": "^3.4.4" and had the same issue.
Deleting export const runtime = 'edge'; from my Hono route.ts setup and restarting the app worked for me.

[eaoliver]

Worked for me too, but I'm still getting a pile of warnings.

` ▲ Next.js 14.2.3

• Environments: .env.local, .env.production

Creating an optimized production build ...
⚠ Compiled with warnings

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js module is loaded ('net' at line 1) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js module is loaded ('tls' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js module is loaded ('crypto' at line 3) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js module is loaded ('stream' at line 4) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js API is used (setImmediate at line: 244) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js API is used (clearImmediate at line: 250) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js API is used (process.hrtime at line: 351) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js API is used (clearImmediate at line: 409) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js API is used (clearImmediate at line: 422) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
A Node.js API is used (process.hrtime at line: 438) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
A Node.js module is loaded ('os' at line 1) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
A Node.js module is loaded ('fs' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts

./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/large.js
A Node.js module is loaded ('stream' at line 1) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime

Import trace for requested module:
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/large.js
./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js
./src/database/schema.ts
./src/auth.ts`

[servesh-chaturvedi]

If anyone is facing this issue with Supabase, try using drizzle-orm/neon-serverless instead of the postgres as mentioned in the docs. Thank you @realmikesolo for your inputs:

import { Pool } from '@neondatabase/serverless'
import { drizzle } from 'drizzle-orm/neon-serverless'

const connectionString = process.env.DATABASE_URL!

const pool = new Pool({ connectionString })
export const db = drizzle(pool)

[realmikesolo]

You can use @vercel/postgres as a client for Vercel Postgres, and @neondatabase/serverless for non-Vercel Postgres clients, because the Vercel Postgres driver implements specific connection string checks that may not be compatible with other PostgreSQL clients. Overall, both drivers enable database access and querying from serverless and edge environments.