Skip to main content
HTTP proxy utilities built on the web Fetch API. Use fetch-proxy to create fetch handlers that forward requests to target servers while optionally rewriting headers and cookies.

​
Features

  • Web Standards - Built on the standard JavaScript Fetch API
  • Cookie Rewriting - Supports rewriting Set-Cookie headers received from target server
  • Forwarding Headers - Supports X-Forwarded-Proto and X-Forwarded-Host headers
  • Custom Fetch - Supports custom fetch implementations

​
Installation

npm install remix

​
API Reference

​
createFetchProxy

Create a fetch proxy handler that forwards requests to a target server.
​
target
string
required
The base URL of the target server to proxy requests to
​
options
FetchProxyOptions
Configuration options for the proxy

​
FetchProxyOptions

​
fetch
typeof fetch
Custom fetch implementation to use for making requests. Defaults to global fetch.
​
rewriteCookies
boolean | (cookie: SetCookie) => SetCookie
Whether to rewrite Set-Cookie headers. If true, rewrites cookies to remove Domain and Secure attributes. If a function, allows custom cookie rewriting.
​
forwardedHeaders
boolean
Whether to add X-Forwarded-Proto and X-Forwarded-Host headers. Defaults to true.

​
Returns

​
proxy
(request: Request) => Promise<Response>
A fetch handler that proxies requests to the target server

​
Usage Examples

​
Basic Proxy

Create a simple proxy that forwards all requests: 
import { createFetchProxy } from 'remix/fetch-proxy'

// Create a proxy that sends all requests to remix.run
let proxy = createFetchProxy('https://remix.run')

// Use in a fetch handler
function handleFetch(request: Request): Promise<Response> {
  return proxy(request)
}

// Test it
let response = await handleFetch(new Request('https://example.com/docs'))
console.log(await response.text())
Rewrite cookies from the target server: 
import { createFetchProxy } from 'remix/fetch-proxy'

let proxy = createFetchProxy('https://api.example.com', {
  // Automatically remove Domain and Secure attributes
  rewriteCookies: true,
})
Custom cookie rewriting: 
import { createFetchProxy } from 'remix/fetch-proxy'
import { SetCookie } from 'remix/headers'

let proxy = createFetchProxy('https://api.example.com', {
  rewriteCookies(cookie) {
    // Remove domain and make cookie accessible to all paths
    return SetCookie.from(cookie.toString(), {
      domain: undefined,
      path: '/',
    })
  },
})

​
Custom Fetch Implementation

Use a custom fetch implementation with additional headers or authentication: 
import { createFetchProxy } from 'remix/fetch-proxy'

let proxy = createFetchProxy('https://api.example.com', {
  async fetch(url, init) {
    // Add authentication header to all proxied requests
    let headers = new Headers(init?.headers)
    headers.set('Authorization', `Bearer ${process.env.API_KEY}`)

    return fetch(url, {
      ...init,
      headers,
    })
  },
})

​
Disable Forwarded Headers

Disable X-Forwarded-* headers if not needed: 
import { createFetchProxy } from 'remix/fetch-proxy'

let proxy = createFetchProxy('https://api.example.com', {
  forwardedHeaders: false,
})

​
Use Cases

  • API Gateway - Route requests to multiple backend services
  • Development Proxy - Proxy API requests during local development
  • CORS Workaround - Proxy requests to avoid CORS restrictions
  • Request Transformation - Modify requests/responses between client and server
  • Load Balancing - Distribute requests across multiple backend servers

Fetch Router

Build routers with fetch handlers

Headers

Work with HTTP headers

Build docs developers (and LLMs) love

Get started for freeTalk to us