Mount Middleware

The Mount Middleware lets you mount an application built with another framework into your Hono application.

Import

import { Hono } from 'hono'
import { mount } from 'hono/mount'

Usage

Register the middleware with app.all() on a path that ends with /*:

import { Router as IttyRouter } from 'itty-router'

// Create itty-router application
const ittyRouter = IttyRouter()

// Handle `GET /itty-router/hello`
ittyRouter.get('/hello', () => new Response('Hello from itty-router'))

const app = new Hono()

app.all('/itty-router/*', mount(ittyRouter.handle))

By default, the mounted application receives a new Request with the matched path prefix removed from its URL. A request to /itty-router/hello reaches itty-router as /hello.

The mounted application is called as handler(request, c.env, c.executionCtx), the same arguments as a Cloudflare Workers fetch handler. Use optionHandler to pass different arguments.

Options

You can pass a function or an object as the second argument.

optional optionHandler: (c: Context) => unknown

Returns the arguments passed to the mounted application after the Request. An array is spread into multiple arguments. You can pass the function directly as the second argument:

// Call `anotherApp(request, c.env)`
app.all(
  '/app/*',
  mount(anotherApp, (c) => c.env)
)

// Call `anotherApp(request, c.env, c.executionCtx)`
app.all(
  '/app/*',
  mount(anotherApp, {
    optionHandler: (c) => [c.env, c.executionCtx],
  })
)

optional replaceRequest: ((originalRequest: Request) => Request) | false

Controls which Request is passed to the mounted application:

// `/legacy/users` reaches the mounted application as `/api/users`
app.all(
  '/legacy/*',
  mount(anotherApp, {
    replaceRequest: (req) => {
      const url = new URL(req.url)
      url.pathname = url.pathname.replace(/^\/legacy/, '/api')
      return new Request(url, req)
    },
  })
)

To pass the original Request unchanged, set it to false as a shorthand for (req) => req:

app.all(
  '/app/*',
  mount(anotherApp, {
    replaceRequest: false,
  })
)