fix: server.headers after restart in middleware mode

packages/vite/src/node/server/index.ts

@@ -711,17 +711,15 @@ export async function _createServer(
  // this applies before the transform middleware so that these files are served
  // as-is without transforms.
  if (config.publicDir) {
- middlewares.use(
- servePublicMiddleware(config.publicDir, config.server.headers),
- )
+ middlewares.use(servePublicMiddleware(server))
  }
 
  // main transform middleware
  middlewares.use(transformMiddleware(server))
 
  // serve static files
  middlewares.use(serveRawFsMiddleware(server))
- middlewares.use(serveStaticMiddleware(root, server))
+ middlewares.use(serveStaticMiddleware(server))
 
  // html fallback
  if (config.appType === 'spa' || config.appType === 'mpa') {

packages/vite/src/node/server/middlewares/indexHtml.ts

@@ -393,9 +393,6 @@ export function indexHtmlMiddleware(
  server: ViteDevServer | PreviewServer,
 ): Connect.NextHandleFunction {
  const isDev = isDevServer(server)
- const headers = isDev
- ? server.config.server.headers
- : server.config.preview.headers
 
  // Keep the named function. The name is visible in debug logs via `DEBUG=connect:dispatcher ...`
  return async function viteIndexHtmlMiddleware(req, res, next) {
@@ -414,6 +411,10 @@ export function indexHtmlMiddleware(
  }
 
  if (fs.existsSync(filePath)) {
+ const headers = isDev
+ ? server.config.server.headers
+ : server.config.preview.headers
+
  try {
  let html = await fsp.readFile(filePath, 'utf-8')
  if (isDev) {

packages/vite/src/node/server/middlewares/static.ts

@@ -25,10 +25,10 @@ import {
 const knownJavascriptExtensionRE = /\.[tj]sx?$/
 
 const sirvOptions = ({
- headers,
+ getHeaders,
  shouldServe,
 }: {
- headers?: OutgoingHttpHeaders
+ getHeaders: () => OutgoingHttpHeaders | undefined
  shouldServe?: (p: string) => void
 }): Options => {
  return {
@@ -44,6 +44,7 @@ const sirvOptions = ({
  if (knownJavascriptExtensionRE.test(pathname)) {
  res.setHeader('Content-Type', 'application/javascript')
  }
+ const headers = getHeaders()
  if (headers) {
  for (const name in headers) {
  res.setHeader(name, headers[name]!)
@@ -55,13 +56,13 @@ const sirvOptions = ({
 }
 
 export function servePublicMiddleware(
- dir: string,
- headers?: OutgoingHttpHeaders,
+ server: ViteDevServer,
 ): Connect.NextHandleFunction {
+ const dir = server.config.publicDir
  const serve = sirv(
  dir,
  sirvOptions({
- headers,
+ getHeaders: () => server.config.server.headers,
  shouldServe: (filePath) => shouldServeFile(filePath, dir),
  }),
  )
@@ -77,13 +78,13 @@ export function servePublicMiddleware(
 }
 
 export function serveStaticMiddleware(
- dir: string,
  server: ViteDevServer,
 ): Connect.NextHandleFunction {
+ const dir = server.config.root
  const serve = sirv(
  dir,
  sirvOptions({
- headers: server.config.server.headers,
+ getHeaders: () => server.config.server.headers,
  }),
  )
 
@@ -150,7 +151,7 @@ export function serveRawFsMiddleware(
 ): Connect.NextHandleFunction {
  const serveFromRoot = sirv(
  '/',
- sirvOptions({ headers: server.config.server.headers }),
+ sirvOptions({ getHeaders: () => server.config.server.headers }),
  )
 
  // Keep the named function. The name is visible in debug logs via `DEBUG=connect:dispatcher ...`