Modifying request headers

Learn how to modify request headers in your Middleware.

DX Team
Knowledge Base
3 min read
Last updated November 11, 2025

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.

middleware.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,
    },
  });
}
middleware.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,
    },
  });
}
middleware.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,
    },
  });
}
middleware.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,
    },
  });
}
middleware.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,
    },
  });
}
middleware.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

Was this helpful?

supported.

Read related documentation

Explore more Routing Middleware guides