I am using `nextjs`, i just want to define a `/api/test` and call `env.MY_KV.get("mykey")` in `/api/

Wwhoami I am using `nextjs`, i just want to define a `/api/test` and call `env.MY_KV.get...

X

XiNiHa•6/9/25, 9:55 AM

Try adding the following to next.config.js

// or maybe export default? this may differ per environment
module.exports = {
  // ...other options
  webpack: (config) => {
    config.externals = ['cloudflare:workers'];
    return config
  }
}

// or maybe export default? this may differ per environment
module.exports = {
  // ...other options
  webpack: (config) => {
    config.externals = ['cloudflare:workers'];
    return config
  }
}

// or maybe export default? this may differ per environment
module.exports = {
  // ...other options
  webpack: (config) => {
    config.externals = ['cloudflare:workers'];
    return config
  }
}

// or maybe export default? this may differ per environment
module.exports = {
  // ...other options
  webpack: (config) => {
    config.externals = ['cloudflare:workers'];
    return config
  }
}

X

XiNiHa•6/9/25, 9:56 AM

Let me know if you already have

webpack

webpack

option customized with your config

XXiNiHa Let me know if you already have `webpack` option customized with your config

W

whoamiOP•6/9/25, 10:02 AM

not work.

W

whoamiOP•6/9/25, 10:02 AM

const nextConfig = {
  webpack: (config) => {
    config.externals = ["cloudflare:workers"];
    return config;
  },
};

export default nextConfig;

const nextConfig = {
  webpack: (config) => {
    config.externals = ["cloudflare:workers"];
    return config;
  },
};

export default nextConfig;

const nextConfig = {
  webpack: (config) => {
    config.externals = ["cloudflare:workers"];
    return config;
  },
};

export default nextConfig;

const nextConfig = {
  webpack: (config) => {
    config.externals = ["cloudflare:workers"];
    return config;
  },
};

export default nextConfig;

W

whoamiOP•6/9/25, 10:02 AM

my

next.config.mjs

next.config.mjs

as above

W

whoamiOP•6/9/25, 10:04 AM

my

route.ts

route.ts

is

import "server-only";
import { env } from "cloudflare:workers";

export async function POST(req: Request) {
  const url = new URL(req.url);
  const key = url.searchParams.get("key") || "testKey";
  const testValue = await env.QA_KVS.get(key);

  return new Response(testValue ?? "No value found", {
    headers: {
      "Content-Type": "text/plain",
    },
  });
}

import "server-only";
import { env } from "cloudflare:workers";

export async function POST(req: Request) {
  const url = new URL(req.url);
  const key = url.searchParams.get("key") || "testKey";
  const testValue = await env.QA_KVS.get(key);

  return new Response(testValue ?? "No value found", {
    headers: {
      "Content-Type": "text/plain",
    },
  });
}

import "server-only";
import { env } from "cloudflare:workers";

export async function POST(req: Request) {
  const url = new URL(req.url);
  const key = url.searchParams.get("key") || "testKey";
  const testValue = await env.QA_KVS.get(key);

  return new Response(testValue ?? "No value found", {
    headers: {
      "Content-Type": "text/plain",
    },
  });
}

import "server-only";
import { env } from "cloudflare:workers";

export async function POST(req: Request) {
  const url = new URL(req.url);
  const key = url.searchParams.get("key") || "testKey";
  const testValue = await env.QA_KVS.get(key);

  return new Response(testValue ?? "No value found", {
    headers: {
      "Content-Type": "text/plain",
    },
  });
}

X

XiNiHa•6/9/25, 10:04 AM

Are you getting the same error?

W

whoamiOP•6/9/25, 10:04 AM

the error message is

 ⨯ Error: Cannot find module 'cloudflare:workers'
Require stack:

 ⨯ Error: Cannot find module 'cloudflare:workers'
Require stack:

 ⨯ Error: Cannot find module 'cloudflare:workers'
Require stack:

 ⨯ Error: Cannot find module 'cloudflare:workers'
Require stack:

XXiNiHa Are you getting the same error?

W

whoamiOP•6/9/25, 10:05 AM

not the same

X

XiNiHa•6/9/25, 10:05 AM

Eh then it looks like Next doesn't support the usecase

W

whoamiOP•6/9/25, 10:06 AM

I am curious how cloudflare handles the kv request?

W

whoamiOP•6/9/25, 10:07 AM

maybe we should have a sdk installed?

X

XiNiHa•6/9/25, 10:07 AM

How are you deploying the Next app to Cloudflare?

X

XiNiHa•6/9/25, 10:07 AM

Are you using next-on-pages or opennext?

XXiNiHa How are you deploying the Next app to Cloudflare?

W

whoamiOP•6/9/25, 10:08 AM

I am using this starter.

Wwhoami I am using this starter.

X

XiNiHa•6/9/25, 10:12 AM

I believe that's using opennext, then refer to the following
https://opennext.js.org/cloudflare/bindings

Bindings - OpenNext

Open-source Next.js adapters

XXiNiHa I believe that's using opennext, then refer to the following https://opennext.js...

W

whoamiOP•6/9/25, 10:17 AM

thanks a lot, it works.

W

whoamiOP•6/9/25, 10:18 AM

import { getCloudflareContext } from "@opennextjs/cloudflare";

export async function POST(req: Request) {
  const url = new URL(req.url);
  const key = url.searchParams.get("key") || "testKey";
  const testValue = await getCloudflareContext().env.QA_KVS.get(key);

  return new Response(testValue ?? "No value found", {
    headers: {
      "Content-Type": "text/plain",
    },
  });
}

import { getCloudflareContext } from "@opennextjs/cloudflare";

export async function POST(req: Request) {
  const url = new URL(req.url);
  const key = url.searchParams.get("key") || "testKey";
  const testValue = await getCloudflareContext().env.QA_KVS.get(key);

  return new Response(testValue ?? "No value found", {
    headers: {
      "Content-Type": "text/plain",
    },
  });
}

import { getCloudflareContext } from "@opennextjs/cloudflare";

export async function POST(req: Request) {
  const url = new URL(req.url);
  const key = url.searchParams.get("key") || "testKey";
  const testValue = await getCloudflareContext().env.QA_KVS.get(key);

  return new Response(testValue ?? "No value found", {
    headers: {
      "Content-Type": "text/plain",
    },
  });
}

import { getCloudflareContext } from "@opennextjs/cloudflare";

export async function POST(req: Request) {
  const url = new URL(req.url);
  const key = url.searchParams.get("key") || "testKey";
  const testValue = await getCloudflareContext().env.QA_KVS.get(key);

  return new Response(testValue ?? "No value found", {
    headers: {
      "Content-Type": "text/plain",
    },
  });
}

W

whoamiOP•6/9/25, 10:19 AM

And still need

import { initOpenNextCloudflareForDev } from "@opennextjs/cloudflare";
initOpenNextCloudflareForDev();

import { initOpenNextCloudflareForDev } from "@opennextjs/cloudflare";
initOpenNextCloudflareForDev();

import { initOpenNextCloudflareForDev } from "@opennextjs/cloudflare";
initOpenNextCloudflareForDev();

import { initOpenNextCloudflareForDev } from "@opennextjs/cloudflare";
initOpenNextCloudflareForDev();

in

next.config.mjs

next.config.mjs

W

whoamiOP•6/10/25, 9:43 AM

export default async function Home(req: any) {
  return fetch(`${getBaseUrl(req as NextRequest)}/api/search`, {
    method: "POST",
  })
    .then((r) => r.json() as Promise<ApiResponse<string>>)
    .then((r) => {
      // return Promise.reject(new Error(`xxx`));
      return r.success
        ? Promise.resolve(r)
        : Promise.reject(new Error(r.error));
    })
    .then((r) => {
      return HomeComponent(r);
    });
}

export default async function Home(req: any) {
  return fetch(`${getBaseUrl(req as NextRequest)}/api/search`, {
    method: "POST",
  })
    .then((r) => r.json() as Promise<ApiResponse<string>>)
    .then((r) => {
      // return Promise.reject(new Error(`xxx`));
      return r.success
        ? Promise.resolve(r)
        : Promise.reject(new Error(r.error));
    })
    .then((r) => {
      return HomeComponent(r);
    });
}

export default async function Home(req: any) {
  return fetch(`${getBaseUrl(req as NextRequest)}/api/search`, {
    method: "POST",
  })
    .then((r) => r.json() as Promise<ApiResponse<string>>)
    .then((r) => {
      // return Promise.reject(new Error(`xxx`));
      return r.success
        ? Promise.resolve(r)
        : Promise.reject(new Error(r.error));
    })
    .then((r) => {
      return HomeComponent(r);
    });
}

export default async function Home(req: any) {
  return fetch(`${getBaseUrl(req as NextRequest)}/api/search`, {
    method: "POST",
  })
    .then((r) => r.json() as Promise<ApiResponse<string>>)
    .then((r) => {
      // return Promise.reject(new Error(`xxx`));
      return r.success
        ? Promise.resolve(r)
        : Promise.reject(new Error(r.error));
    })
    .then((r) => {
      return HomeComponent(r);
    });
}

W

whoamiOP•6/10/25, 9:43 AM

I have a server component as above

W

whoamiOP•6/10/25, 9:44 AM

npm run dev

npm run dev

is ok, but after deploying on cloudflare, the page always give error

SyntaxError: Unexpected token 'e', "error code: 522" is not valid JSON

SyntaxError: Unexpected token 'e', "error code: 522" is not valid JSON

W

whoamiOP•6/10/25, 9:45 AM

I know it's the response from fetch is not

json

json

, but why?

W

whoamiOP•6/10/25, 9:46 AM

http request

http request

from the same site on server component will be blocked by

cloudflare

cloudflare

?

W

whoamiOP•6/10/25, 9:47 AM

anyone helps me, please?

J

juanferreras•6/12/25, 6:05 PM

hi – is anyone else seeing errors on KV?

K

kunal•6/12/25, 6:06 PM

I'm getting a bunch of failures

S

scook•6/12/25, 6:07 PM

KV GET failed: 503 Service temporarily unavailable

J

juanferreras•6/12/25, 6:07 PM

surprised it didn't get listed on https://www.cloudflarestatus.com/ yet

Cloudflare Status

Welcome to Cloudflare's home for real-time and historical data on system performance.

L

Luke•6/12/25, 6:10 PM

Same KV errors here! Glad I'm not alone on this

T

threecreepio•6/12/25, 6:12 PM

yeah same here

A

ajgeiss0702•6/12/25, 6:14 PM

a lot of things around the internet are broken right now, wonder if its a coincidence that KV goes down at the same time

D

ddsgadget•6/12/25, 6:16 PM

same here. Why don't they update the status page. I never understand what the point of a status page is, if it never shows anything. Have to log onto discord to see what's u p

J

jdanyow•6/12/25, 6:16 PM

same

C

Chaika•6/12/25, 6:17 PM

They know internally and are working on it

C

Chaika•6/12/25, 6:17 PM

Status pages is just diff teams/requires approval/etc

C

Chaika•6/12/25, 6:17 PM

also CF Access is down, maybe they at least partially used it for IdP login lol, who knows. All we know so far is they know, and a ton of products are affected

J

juanferreras•6/12/25, 6:18 PM

thanks, Chaika!

D

ddsgadget•6/12/25, 6:18 PM

Thanks. Glad they know.

A

AZipr•6/12/25, 6:22 PM

Kv down

D

ddsgadget•6/12/25, 6:22 PM

this just reminds me that you need backups to KV outside of Cloudflare with another service. Keep forgetting to set this up. I'm too reliant on Cloudflare now. There goes my weekend

Τ

ταυ•6/12/25, 6:23 PM

It's so over

A

AZipr•6/12/25, 6:23 PM

Use r2 to backup. I have a worker that runs daily (cron) and keeps it in r2

Dddsgadget this just reminds me that you need backups to KV outside of Cloudflare with anot...

A

AZipr•6/12/25, 6:24 PM

Yep. Backup plan of backup plan

I am using `nextjs`, i just want to define a `/api/test` and call `env.MY_KV.get("mykey")` in `/api/

Similar Threads

Similar Threads

Similar Threads