Cloudflare Pages

import { handle, handleMiddleware, serveStatic, getConnInfo } from 'hono/cloudflare-pages'
import type { EventContext } from 'hono/cloudflare-pages'

function handle<E extends Env, S extends Schema, BasePath extends string>(
  app: Hono<E, S, BasePath>
): PagesFunction<E['Bindings']>

// functions/_middleware.ts
import { Hono } from 'hono'
import { handle } from 'hono/cloudflare-pages'

const app = new Hono()

app.get('/api/*', (c) => c.text('Hello from Cloudflare Pages!'))
app.post('/api/form', async (c) => {
  const body = await c.req.parseBody()
  return c.json({ success: true, data: body })
})

export const onRequest = handle(app)

function handleMiddleware<E extends Env, P extends string, I extends Input>(
  middleware: MiddlewareHandler<E, P, I>
): PagesFunction<E['Bindings']>

// functions/_middleware.ts
import { handleMiddleware } from 'hono/cloudflare-pages'
import { logger } from 'hono/logger'

export const onRequest = handleMiddleware(logger())

function serveStatic(): MiddlewareHandler

import { Hono } from 'hono'
import { serveStatic } from 'hono/cloudflare-pages'

const app = new Hono()

// Serve static files from the public directory
app.use('/static/*', serveStatic())

app.get('/api/hello', (c) => c.text('Hello API'))

export const onRequest = handle(app)

function getConnInfo(c: Context): ConnInfo

interface ConnInfo {
  remote: {
    address?: string // Client IP from cf-connecting-ip header
  }
}

import { Hono } from 'hono'
import { handle, getConnInfo } from 'hono/cloudflare-pages'

const app = new Hono()

app.get('/', (c) => {
  const info = getConnInfo(c)
  return c.text(`Your IP: ${info.remote.address}`)
})

export const onRequest = handle(app)

interface EventContext<Env = {}, P extends string = any, Data = Record<string, unknown>> {
  request: Request
  functionPath: string
  waitUntil: (promise: Promise<unknown>) => void
  passThroughOnException: () => void
  next: (input?: Request | string, init?: RequestInit) => Promise<Response>
  env: Env & { ASSETS: { fetch: typeof fetch } }
  params: Params<P>
  data: Data
}

import { Hono } from 'hono'
import { handle } from 'hono/cloudflare-pages'
import type { EventContext } from 'hono/cloudflare-pages'

type Env = {
  Bindings: {
    MY_KV: KVNamespace
    eventContext: EventContext
  }
}

const app = new Hono<Env>()

app.get('/api/data', async (c) => {
  const { eventContext } = c.env
  
  // Use waitUntil for background tasks
  eventContext.waitUntil(
    c.env.MY_KV.put('last-access', new Date().toISOString())
  )
  
  return c.json({ functionPath: eventContext.functionPath })
})

export const onRequest = handle(app)

project/
├── functions/
│   ├── _middleware.ts    # Global middleware
│   ├── api/
│   │   └── [[path]].ts   # Catch-all for /api/*
│   └── index.ts
└── public/
    └── index.html