[⚡ Feature]: Draft Mode

[2820402]

Description

Draft Mode allows you to preview draft content from your headless CMS in your Next.js application. This is useful for static pages that are generated at build time as it allows you to switch to dynamic rendering and see the draft changes without having to rebuild your entire site. https://nextjs.org/docs/app/building-your-application/configuring/draft-mode

Additional Information

No response

Would you like to help?

• Would you like to help implement this feature?

[RokasVaitkevicius]

I'm having troubles with draft mode as well. I just cannot get it to work on cloudflare using edge runtime. It seems that edge is missing some environment variables that get set in vercel.

In particular I've tracked it down to these:

'__NEXT_PREVIEW_MODE_ENCRYPTION_KEY',
'__NEXT_PREVIEW_MODE_ID',
'__NEXT_PREVIEW_MODE_SIGNING_KEY',

This is the method that uses them: https://github.com/vercel/next.js/blob/canary/packages/next/src/server/web/get-edge-preview-props.ts

Is this missing support from cloduflare side or are we missing some sort of local setup?

[hsnilsson]

Just had the same issue. If of any help, here's a reproduction repo of the error.
https://github.com/hsnilsson/nextjs-draftmode-next-on-pages-reproduction
I based it upon another repo for a similar issue, so the relevant description is in the last commit, here:
hsnilsson/nextjs-draftmode-next-on-pages-reproduction@be6ca46

A headsup quote from one maintainer of this repo in the #next-on-pages discord today:

next-on-pages works for pages and will continue to receive bug fixes and whatnot, but the future direction centers around the workers adaptor and that is where you'll see more long-term support focused

So after reading that I tried switching to @opennextjs/cloudflare instead, but that produces workers of ~10mb for me for just a simple project and 1mb seems to be limit for the free tier.