Cloudflare Pages environment (Bindings/Secrets) not available on SSR api requests made with useAsyncData/$fetch but works with useFetch

Environment

• Operating System: Darwin
• Node Version: v20.10.0
• Nuxt Version: 3.15.0
• CLI Version: 3.17.2
• Nitro Version: 2.10.4
• Package Manager: npm@10.2.3
• Builder: -
• User Config: default
• Runtime Modules: nitro-cloudflare-dev@0.2.1
• Build Modules: -

Reproduction

Repo: https://github.com/edisonlsm/nuxt-cf-ssr-test Deployment on Cloudflare Pages: https://nuxt-cf-ssr-test.pages.dev

Describe the bug

After deploying the project to Cloudflare Pages, the Cloudflare data (Bindings, Variables, etc) are NOT injected on server event.context when making a request to the server/api with useAsyncData/$fetch. However, the data IS available when calling the API directly on the browser or when making the request with useFetch.

Since the data is not present on event.context we can not use Bindings and Secrets and etc.

When running the project locally it works as expected with both useFetch and useAsyncData, the problem only happens when deployed!

1. Created a new project with the Cloudflare Starter template.

npm create cloudflare@latest -- my-nuxt-app --framework=nuxt

2. Created a new api to just return the keys from event.context so we can check the bug:

server/api/hello.ts

export default defineEventHandler(({ context }) => {
  return {
    keys: Object.keys(context)
  };
});

3. When calling the API directly from the browser, we can see that Cloudflare data IS injected into the environment. https://nuxt-cf-ssr-test.pages.dev/api/hello

{"keys":["_nitro","nitro","cf","waitUntil","cloudflare","matchedRoute","params"]}

4. When calling this API from a component with useFetch(), we can see that Cloudflare data IS also injected into the environment.

components/useFetch.vue

const { data, error } = useFetch('/api/hello')

{
  "keys": [
    "_nitro",
    "nitro",
    "cf",
    "waitUntil",
    "cloudflare",
    "matchedRoute",
    "params"
  ]
}

5. However, when calling the same API from a component with useAsyncData/$fetch, we can see that our event.context DOES NOT have the cf and Cloudflare keys.

components/useAsyncData.vue

const { data, error } = useAsyncData(
    'async_data',
    () => $fetch('/api/hello')
)

{
  "keys": [
    "_nitro",
    "nitro",
    "matchedRoute",
    "params"
  ]
}

Additional context

No response

Logs