Cloudflare Pages Middleware

You have to integrate cloudflare-pages using this command to see your files as the files below

npm run qwik add cloudflare-pages

Qwik City Cloudflare Pages middleware allows you to connect Qwik City to Cloudflare Pages.

Below is an example of using the built-in middleware within a user's app.

// entry.cloudflare-pages.tsx
import render from './entry.ssr';
import { qwikCity } from '@builder.io/qwik-city/middleware/cloudflare-pages';

export const onRequest = qwikCity(render);

The compiled middleware can then be used anywhere in the cloudflare pages /functions directory.

// export the compiled middleware where cloudflare pages can find it.
// for example use /functions/[[path]].ts or /functions/_middleware.ts
// to have qwik city handle all requests.

export { onRequest } from '../server/entry.cloudflare-pages';

• Cloudflare Pages Middleware Source
• Cloudflare Pages Functions

Usage

Context

You may access Cloudflare Page's environment variables in the endpoint method's platform param:

export const onRequest = async ({ platform }) => {
  const secret = platform.env["SUPER_SECRET_TOKEN"];
};

Additionally, you may import the RequestHandlerCloudflarePages type to have have type completions in your editor.

import {type RequestHandlerCloudflarePages} from '@builder.io/qwik-city/middleware/cloudflare-pages';

export const onGet: RequestHandlerCloudflarePages = (({ platform }) => {
 //...
})