[🐛 Bug]: Pages Preview D1 bindings not working

[thipperz]

next-on-pages environment related information

System:
Platform: linux
Arch: x64
Version: #1 SMP Thu Jan 11 04:09:03 UTC 2024
CPU: (4) x64 AMD Ryzen 3 3200G with Radeon Vega Graphics
Memory: 8 GB
Shell: /bin/bash
Package Manager Used: pnpm (8.15.4)

Relevant Packages:
@cloudflare/next-on-pages: 1.10.0
vercel: N/A
next: 14.1.3
Wrangler 3.33.0

Description

I get my database with the following function:

export async function getDatabase() {
    let database
    if (process.env.NODE_ENV === 'development') {
        console.log('Development Environment')
        const { env } = getRequestContext()
        database = env.CLOUDFLARE_DATABASE
    } else {
        console.log('Production  Environment')
        database = process.env.CLOUDFLARE_D1
    }

    if (!database) {
        throw new Error('Database is undefined')
    }

    return database
}

After building my project with pnpx @cloudflare/next-on-pages, when previewing it with wrangler pages dev .vercel/output/static --compatibility-flag=nodejs_compat, I'm getting:

Production  Environment
✘ [ERROR] Error: Database is undefined

      at P
  ( [ ...  /.vercel/output/static/_worker.js/__next-on-pages-dist__/webpack/c72fa05c51b4cd4d99212fa02e60faff.js:1:229)
      at null.<anonymous>

It was working fine like.. yesterday or so?

EDIT: I wasn't able to solve this issue even by downgrading wrangler or restoring earlier commits. When I deploy my project (i.e. when I push to git), everything works fine in the ".pages.dev" preview environment

[dario-piotrowicz]

Hi @thipperz 🙂

Nothing changed on our side as far as I know... 🤔

Did you change your wrangler.toml's content by any chance?
In either case, could you share your toml file?

(or even better share your project entirely if it's public 🙂)

[thipperz]

Hi @thipperz 🙂

Nothing changed on our side as far as I know... 🤔

Did you change your wrangler.toml's content by any chance? In either case, could you share your toml file?

(or even better share your project entirely if it's public 🙂)

Hi @dario-piotrowicz!

I was able to identify and resolve the issue while preparing a minimal reproduction. The root cause was that I used a different binding name for production, which led to a "database undefined" error during preview. By aligning the binding name across environments, the issue has been resolved.

Thanks!

[dario-piotrowicz]

I did notice the two different binding names there, but I dismissed that as I thought it was probably intentional 😅

Awesome, I'm glad that you've solved the issue 😄

I'm closing this issue then 🚀