Cloudflare Developers•2y ago

I have found a work around but now I'm getting this every time I submit the form

DDudu I have found a work around but now I'm getting this every time I submit the form

Firu•3/14/24, 12:15 PM

what's the workaround?

FFiru i tried doing `export const runtime = 'edge'` on both files and it still wouldn'...

DuduOP•3/14/24, 12:16 PM

I tried this in different files until it worked

DuduOP•3/14/24, 12:17 PM

In my case I have it on page.tsx

DuduOP•3/14/24, 12:17 PM

Which has the component with 'use client' with the form

Meetee•3/14/24, 2:14 PM

Hi, how can I know the exact file that cause this error?

Meetee•3/14/24, 2:19 PM

I just re-run any successful deployment in the past, and the error is still there, maybe it's not the nextjs's problem

MMeetee Hi, how can I know the exact file that cause this error?

Dario•3/14/24, 6:03 PM

Hi @Meetee , that error message is a bit misleading... with Functions scriptFunctions script it's basically referring to all your javascript code (that gets shipped to the runtime), so this is basically saying that your application, generally doesn't fit the free tier workers size limit

Dario•3/14/24, 6:04 PM

If you could move to the paid plan the limit there increases to 10MiB: https://developers.cloudflare.com/workers/platform/limits/#worker-size

Cloudflare Docs

Limits · Cloudflare Workers docs

Cloudflare Workers plan and platform limits.

oljimenez•3/15/24, 7:13 AM

Hi guys, i'm unable to make Cloudflare next-on-pages work on development using Docker. When i run the app locally it work well, but when i run the same app on Docker environment it just crash.

Github repo for reproduction. https://github.com/oljimenez/cloudflare-app

GitHub

GitHub - oljimenez/cloudflare-app

Contribute to oljimenez/cloudflare-app development by creating an account on GitHub.

zapalona_swieczka•3/15/24, 5:15 PM

I'm working on testing migrating next project to cf pages, seeing some issues here and there I wonder if anyone launched productionally some more complex site, not just static pages (like ecommerce frontend)?

thanhle•3/15/24, 7:41 PM

how do I get support with image optimization for cloudflare pages use next-on-pages in nextjs

thanhle•3/16/24, 3:21 AM

how do i set up the prisma with next-on-pages applicataion?

Nooc•3/16/24, 3:33 AM

Is anybody knows how to access Cloudflare Environments (KV, Workers AI etc) in server actions?

Tthanhle how do I get support with image optimization for cloudflare pages use next-on-pa...

Befus•3/16/24, 8:43 AM

https://github.com/cloudflare/next-on-pages/blob/60eb0aef9d7b0835204e62c167f9f0cbd5c23404/packages/next-on-pages/docs/supported.md

GitHub

next-on-pages/packages/next-on-pages/docs/supported.md at 60eb0aef9...

CLI to build and develop Next.js apps for Cloudflare Pages - cloudflare/next-on-pages

NNooc Is anybody knows how to access Cloudflare Environments (KV, Workers AI etc) in s...

Befus•3/16/24, 8:44 AM

https://github.com/cloudflare/next-on-pages/tree/60eb0aef9d7b0835204e62c167f9f0cbd5c23404/packages/next-on-pages#cloudflare-platform-integration

GitHub

next-on-pages/packages/next-on-pages at 60eb0aef9d7b0835204e62c167f...

CLI to build and develop Next.js apps for Cloudflare Pages - cloudflare/next-on-pages

Tthanhle how do I get support with image optimization for cloudflare pages use next-on-pa...

Deo Kumar•3/16/24, 3:43 PM

For image optimisation on edge runtime, you can use https://github.com/node-libraries/wasm-image-optimization

GitHub

GitHub - node-libraries/wasm-image-optimization: Optimize images wi...

Optimize images with wasm on edge runtime. Contribute to node-libraries/wasm-image-optimization development by creating an account on GitHub.

Chris (L3)•3/16/24, 7:23 PM

I've been unable to use Server Actions with next apps deployed on Cloudflare Pages. The only working solution is the one in this comment (https://community.cloudflare.com/t/next-js-server-action-error-405/601134/3), which is to set the

runtime = edge

runtime = edge

, but that nullifies static generation, right?

If I have a simple page with a form that has a Server Action, and I set the runtime to

edge

edge

that means the page will be rendered for each request, isn't that right? Am I missing something?

Chris (L3)•3/16/24, 7:24 PM

In my experience this also introduces other weird issues throughout the app that are hard to debug the more complex it gets.

Chris (L3)•3/16/24, 9:21 PM

Basically for me, if you're saying Server Actions are compatible with Cloudflare but you have to do this to your project that's very misleading. I hope I'm missing something, new to the overall Cloudflare infrastructure offering so I don't know the nitty gritty details.

Chris (L3)•3/16/24, 9:34 PM

Is there a way to keep a page statically generated, while using Server Actions? Or will that never happen on Cloudflare, it's either full static or full dynamic?

CChris (L3)Is there a way to keep a page statically generated, while using Server Actions? ...

Hello, I’m Allie!•3/16/24, 9:46 PM

As I understand, it is a limitation of Next itself. It's server expects control over serving all pages/assets, so all routes will incur functions requests, regardless of whether or not they are actually dynamic

Chris (L3)•3/16/24, 11:35 PM

Alright, so if I have a page that doesn't need hydration, doesn't have any interactive stuff, not even server actions (so not setting

runtime: edge

runtime: edge

), will that page be statically generated and served like it would be from R2/CDN basically? Or is everything run each time, even the 100% static pages. I'm trying to figure out how the NextJS bundle generation, NextJS caching, Cloudflare caching, and overall Cloudflare infra work together. Are there any resources about this I can read?

James•3/17/24, 12:37 PM

If you're using @clourflare/next-on-pages, you will incur a function invocation for every request. Your pages may be prerendered at build time and these pretended files will be served instead of doing SSR, but it still results in an invocation because requests to routes need to go through the routing system so that they can correctly match up with the right prerendered file or edge function, based on rules determined by Vercel during build.

James•3/17/24, 12:44 PM

I haven't actually investigated the 405 with server actions before, but if you're calling it from a prerendered route, i would speculate that on Vercel they bypass the prerendered route and invoke the nodejs function for action calls on static routes, which is not something we are able to do. Again, I haven't looked into it before, but that would be an initial assumption.

JJames If you're using @clourflare/next-on-pages, you will incur a function invocation ...

Chris (L3)•3/17/24, 6:08 PM

Alright, but to clarify, the message in the console at build time (whether it's in a next-on-pages or plain create-next-app) that says "enabling edge runtime disables static generation" is correct, right? The request that Cloudflare will make will be one to render the page each time, not to get it from a file bucket with pre-rendered pages (even if the page has no interactivity, but it has the

edge

edge

runtime set). Yes, I get it that it invokes a function each time no matter what, question is does the function render the static page each time, or serve the pre-rendered file.

Chris (L3)•3/17/24, 6:08 PM

Thanks for the help James!

CChris (L3)Alright, but to clarify, the message in the console at build time (whether it's ...

James•3/17/24, 6:31 PM

Yes, if you enable the edge runtime for a route, it will always create an edge function, because Vercel don't want to support prerendered routes or ISR when someone uses the edge runtime.

When the edge runtime is enabled, it creates a function that is run at each request to SSR the route.

When not using the edge runtime for a route, it will be prerendered and served from the static assets by the router.

Chris (L3)•3/17/24, 8:33 PM

You're a boss, thanks!

Pepijn•3/18/24, 10:44 AM

Hi, I have a turborepo including a Next project that is deployed on CF pages. Everything works fine, but build caching says 'Skipping build output cache as it's not supported for your project'. Is this due to using turborepo? The source directory to build in is set to the app directory. Or why would the build ouput be skipped?

Pepijn•3/18/24, 10:46 AM

Also yarn v3 dependencies located in .yarn/cache are not being cached, I wanted to set the yarn cache dir to .next/cache/yarn to make it work, but due to the build output cache being skipped, that workaround is not possible.

Aalongubkin Yeah, I'll debug it more on my own (wasn't aware of the `deployment tail` trick)...

mr nooli•3/18/24, 11:10 AM

any luck with this? I'm getting this trying to run prisma & the neon driver

mr nooli•3/18/24, 11:13 AM

I believe potentially due to using a singleton pattern for the prisma connection, is there an example I can look at on how to use neon & prisma in a CF worker

Mmr nooli any luck with this? I'm getting this trying to run prisma & the neon driver

Chris (L3)•3/18/24, 6:42 PM

The right way of using prisma is by installing drizzle (https://orm.drizzle.team/docs/get-started-postgresql#usage-with-cloudflare-workers)

Drizzle ORM - PostgreSQL

Drizzle ORM is a lightweight and performant TypeScript ORM with developer experience in mind.

Pat Branchaud•3/19/24, 12:30 AM

Hello! I’m about to try this, but does this setup https://developers.cloudflare.com/pages/framework-guides/nextjs/deploy-a-nextjs-site/ allows next ssr functionality? In other words, is this can replace Vercel completely? Thank you

Cloudflare Docs

Full-stack deployment · Cloudflare Pages docs

Deploy a full-stack Next.js site (recommended).

James•3/19/24, 6:18 AM

Yes you can have SSR if you opt a route into the edge runtime

Mahbub Hasan Hira•3/19/24, 7:48 AM

I am trying to deploy nextjs 12 on CF. but said to add edge runtime to SSG or ISR pages like first image. I export the edge runtime as like 2nd pic but after that CF says that same error. The last image is the build config. How can I solve the error?

Mahbub Hasan Hira•3/19/24, 8:43 AM

and my nextjs version is 12.1.0

Pepijn•3/19/24, 9:40 AM

Has anyone got Sentry logging (server + client) up and running with Next on Pages using the App router?

Pepijn•3/19/24, 9:40 AM

Doesnt seem to work if I follow the sentry install wizard of their next plugin

Pepijn•3/19/24, 10:03 AM

I also have another issue with next-on-pages where sometimes the revalidateTag in a server action is returning the error: "Error: Invariant: static generation store missing in revalidateTag X"

thanhle•3/19/24, 12:47 PM

i have a question: is there any tool that can convert the code nextjs written in nodejs to cloudflare edge runtime (v8 engine) to deploy in cloudflare

James•3/19/24, 12:59 PM

Not currently

PPepijn Has anyone got Sentry logging (server + client) up and running with Next on Page...

ItsWendell•3/19/24, 9:37 PM

Also curious about this, I wanna try out vercel's open telemetry package soon, for workers people use generally ToucanJs, a sentry compatible package, but it hasn't been updated in a while. I know a while ago there was some conversation in the sentry cliënt GitHub. Keep me posted if you find a nice solution, I'll look into this in the next coming weeks too!

MMahbub Hasan Hira and my nextjs version is 12.1.0

Pat Branchaud•3/19/24, 11:52 PM

Try placing it at the very beginning of the file

Pat Branchaud•3/20/24, 5:17 PM

Does —turbo flag apply for cloudflare next-on-pages ??

Pat Branchaud•3/20/24, 10:29 PM

Another question, are the server actions functional with next-on-pages ? https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations

Data Fetching: Server Actions and Mutations | Next.js

Learn how to handle form submissions and data mutations with Next.js.

Dario•3/20/24, 11:04 PM

yes they are

Pat Branchaud•3/20/24, 11:05 PM

That’s fnice

Dario•3/20/24, 11:06 PM

although they might not work everywhere

https://github.com/cloudflare/next-on-pages/issues/679

GitHub

[🐛 Bug]: Calling server actions on a static or SSR pages returns 40...

next-on-pages environment related information System: Platform: darwin Arch: arm64 Version: Darwin Kernel Version 23.2.0: Wed Nov 15 21:55:06 PST 2023; root:xnu-10002.61.3~2/RELEASE_ARM64_T6020 CPU...

Dario•3/20/24, 11:06 PM

I need to investigate this

I have found a work around but now I'm getting this every time I submit the form

Similar Threads

Similar Threads

Similar Threads