---
title: Modifying request headers
description: Learn how to modify request headers in your Middleware.
url: "https://vercel.com/kb/guide/modify-request-headers"
published: 2025-11-03
last_updated: 2025-11-11
authors: DX Team
install_vercel_plugin: npx plugins add vercel/vercel-plugin
---

The following example shows how to modify request headers in your Middleware.

Your `middleware` file should be placed at the root of your project. If you are using the `src` directory, the file should be placed in the `src` directory.

```js
import { NextResponse } from 'next/server';

export default function middleware(request) {
  // Clone the request headers
  // You can modify them with headers API: https://developer.mozilla.org/en-US/docs/Web/API/Headers
  const requestHeaders = new Headers(request.headers);

  // Add new request headers
  requestHeaders.set('x-hello-from-middleware1', 'hello');
  requestHeaders.set('x-hello-from-middleware2', 'world!');

  // Update an existing request header
  requestHeaders.set('user-agent', 'New User Agent overriden by middleware!');

  // Delete an existing request header
  requestHeaders.delete('x-from-client');

  // You can also set request headers in NextResponse.rewrite
  return NextResponse.next({
    request: {
      // New request headers
      headers: requestHeaders,
    },
  });
}
```
```ts
import { NextResponse } from 'next/server';

export default function middleware(request: Request) {
  // Clone the request headers
  // You can modify them with headers API: https://developer.mozilla.org/en-US/docs/Web/API/Headers
  const requestHeaders = new Headers(request.headers);

  // Add new request headers
  requestHeaders.set('x-hello-from-middleware1', 'hello');
  requestHeaders.set('x-hello-from-middleware2', 'world!');

  // Update an existing request header
  requestHeaders.set('user-agent', 'New User Agent overriden by middleware!');

  // Delete an existing request header
  requestHeaders.delete('x-from-client');

  // You can also set request headers in NextResponse.rewrite
  return NextResponse.next({
    request: {
      // New request headers
      headers: requestHeaders,
    },
  });
}
```
```js
import { NextResponse } from 'next/server';

export default function middleware(request) {
  // Clone the request headers
  // You can modify them with headers API: https://developer.mozilla.org/en-US/docs/Web/API/Headers
  const requestHeaders = new Headers(request.headers);

  // Add new request headers
  requestHeaders.set('x-hello-from-middleware1', 'hello');
  requestHeaders.set('x-hello-from-middleware2', 'world!');

  // Update an existing request header
  requestHeaders.set('user-agent', 'New User Agent overriden by middleware!');

  // Delete an existing request header
  requestHeaders.delete('x-from-client');

  // You can also set request headers in NextResponse.rewrite
  return NextResponse.next({
    request: {
      // New request headers
      headers: requestHeaders,
    },
  });
}
```
```ts
import { NextResponse } from 'next/server';

export default function middleware(request: Request) {
  // Clone the request headers
  // You can modify them with headers API: https://developer.mozilla.org/en-US/docs/Web/API/Headers
  const requestHeaders = new Headers(request.headers);

  // Add new request headers
  requestHeaders.set('x-hello-from-middleware1', 'hello');
  requestHeaders.set('x-hello-from-middleware2', 'world!');

  // Update an existing request header
  requestHeaders.set('user-agent', 'New User Agent overriden by middleware!');

  // Delete an existing request header
  requestHeaders.delete('x-from-client');

  // You can also set request headers in NextResponse.rewrite
  return NextResponse.next({
    request: {
      // New request headers
      headers: requestHeaders,
    },
  });
}
```
```js
import { next } from '@vercel/functions';

export default function middleware(request) {
  // Clone the request headers
  // You can modify them with headers API: https://developer.mozilla.org/en-US/docs/Web/API/Headers
  const requestHeaders = new Headers(request.headers);

  // Add new request headers
  requestHeaders.set('x-hello-from-middleware1', 'hello');
  requestHeaders.set('x-hello-from-middleware2', 'world!');

  // Update an existing request header
  requestHeaders.set('user-agent', 'New User Agent overriden by middleware!');

  // Delete an existing request header
  requestHeaders.delete('x-from-client');

  // You can also set request headers in NextResponse.rewrite
  return next({
    request: {
      // New request headers
      headers: requestHeaders,
    },
  });
}
```
```ts
import { next } from '@vercel/functions';

export default function middleware(request: Request) {
  // Clone the request headers
  // You can modify them with headers API: https://developer.mozilla.org/en-US/docs/Web/API/Headers
  const requestHeaders = new Headers(request.headers);

  // Add new request headers
  requestHeaders.set('x-hello-from-middleware1', 'hello');
  requestHeaders.set('x-hello-from-middleware2', 'world!');

  // Update an existing request header
  requestHeaders.set('user-agent', 'New User Agent overriden by middleware!');

  // Delete an existing request header
  requestHeaders.delete('x-from-client');

  // You can also set request headers in NextResponse.rewrite
  return next({
    request: {
      // New request headers
      headers: requestHeaders,
    },
  });
}
```

## More resources

- [Middleware](/docs/routing-middleware)
  
- [Middleware API](/docs/routing-middleware/api)

## More Routing Middleware guides

- [How can I increase the limit of redirects or use dynamic redirects on Vercel?](/kb/guide/how-can-i-increase-the-limit-of-redirects-or-use-dynamic-redirects-on-vercel): Instructions on how to use Serverless Functions to handle redirects on Vercel.
- [How to Optimize Next.js + Sitecore JSS](/kb/guide/how-to-optimize-next.js-sitecore-jss): This guide covers performance and usage considerations when building and deploying your Next.js and Sitecore JSS application.
- [Dynamic redirects with Global Config and Next.js proxy](/kb/guide/dynamic-redirects-with-global-config-and-next-js-proxy): Learn how to create redirects that update instantly without redeploying by storing rules in Global Config and reading them from your Next.js proxy.