Hello,
I am not seeing a response header added when testing one of the Edge Middleware examples to modify headers with the intention to eventually use it for a CSP. I’ve deployed the example to add a custom header, then continue the middleware chain. The only change I made was to add a console log to confirm that request passed through the middleware which it does and the log appears in the project logs…
Here is my middleware.ts taken straight from the example
import { next } from '@vercel/edge';
export default function middleware(request: Request) {
// Clone the request headers
const requestHeaders = new Headers(request.headers);
// Set a new header `x-hello-from-middleware1`
requestHeaders.set('x-hello-from-middleware1', 'hello');
// Log that middleware was seen
console.log('middleware says hello');
// Use the `next()` function to forward the request with modified headers
return next({
request: {
headers: requestHeaders,
},
headers: {
'x-hello-from-middleware2': 'hello',
},
});
}
I’m expecting to see ‘x-hello-from-middleware2’: ‘hello’ in the response headers when visiting my deployment.
In fact I just see:
HTTP/2 304
cache-control: public, max-age=0, must-revalidate
date: Wed, 15 Jan 2025 22:09:46 GMT
server: Vercel
x-vercel-cache: HIT
x-vercel-id: <snip>
Preview URL: https://vercel-sandbox-8o5qpt1wf-cinesend.vercel.app/
Environment: Preview (issue exists), Production (issue exists)
Project Framework: Vite w/ vanilla js
Package Manager: yarn
This is a Vite project if that helps. Root Directory is set in project settings and that directory has this structure:
index.html
middleware.ts
node_modules
package.json
public
src
yarn.lock
Grateful for any thoughts or ideas how to get it working…
-Travis
Toronto