Skip to content

Commit

Permalink
feat: show warning on 431 response (#9324)
Browse files Browse the repository at this point in the history
Co-authored-by: Bjorn Lu <bjornlu.dev@gmail.com>
  • Loading branch information
sapphi-red and bluwy authored Aug 10, 2022
1 parent c868e64 commit e8b61bb
Show file tree
Hide file tree
Showing 4 changed files with 44 additions and 2 deletions.
10 changes: 10 additions & 0 deletions docs/guide/troubleshooting.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,16 @@ To solve this:
$ sudo sysctl fs.inotify.max_user_watches=524288
```

### 431 Request Header Fields Too Large

When the server / WebSocket server receives a large HTTP header, the request will be dropped and the following warning will be shown.

> Server responded with status code 431. See https://vitejs.dev/guide/troubleshooting.html#_431-request-header-fields-too-large.

This is because Node.js limits request header size to mitigate [CVE-2018-12121](https://www.cve.org/CVERecord?id=CVE-2018-12121).

To avoid this, try to reduce your request header size. For example, if the cookie is long, delete it. Or you can use [`--max-http-header-size`](https://nodejs.org/api/cli.html#--max-http-header-sizesize) to change max header size.

## HMR

### Vite detects a file change but the HMR is not working
Expand Down
17 changes: 17 additions & 0 deletions packages/vite/src/node/http.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import type {
} from 'node:http'
import type { ServerOptions as HttpsServerOptions } from 'node:https'
import type { Connect } from 'types/connect'
import colors from 'picocolors'
import { isObject } from './utils'
import type { ProxyOptions } from './server/middlewares/proxy'
import type { Logger } from './logger'
Expand Down Expand Up @@ -183,3 +184,19 @@ export async function httpServerStart(
})
})
}

export function setClientErrorHandler(
server: HttpServer,
logger: Logger
): void {
server.on('clientError', (err, socket) => {
if ((err as any).code === 'HPE_HEADER_OVERFLOW') {
logger.warn(
colors.yellow(
'Server responded with status code 431. ' +
'See https://vitejs.dev/guide/troubleshooting.html#_431-request-header-fields-too-large.'
)
)
}
})
}
8 changes: 7 additions & 1 deletion packages/vite/src/node/preview.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,12 @@ import type { Connect } from 'types/connect'
import corsMiddleware from 'cors'
import type { ResolvedServerOptions, ResolvedServerUrls } from './server'
import type { CommonServerOptions } from './http'
import { httpServerStart, resolveHttpServer, resolveHttpsConfig } from './http'
import {
httpServerStart,
resolveHttpServer,
resolveHttpsConfig,
setClientErrorHandler
} from './http'
import { openBrowser } from './server/openBrowser'
import compression from './server/middlewares/compression'
import { proxyMiddleware } from './server/middlewares/proxy'
Expand Down Expand Up @@ -78,6 +83,7 @@ export async function preview(
app,
await resolveHttpsConfig(config.preview?.https, config.cacheDir)
)
setClientErrorHandler(httpServer, config.logger)

// apply server hooks from plugins
const postHooks: ((() => void) | void)[] = []
Expand Down
11 changes: 10 additions & 1 deletion packages/vite/src/node/server/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,12 @@ import type { Connect } from 'types/connect'
import launchEditorMiddleware from 'launch-editor-middleware'
import type { SourceMap } from 'rollup'
import type { CommonServerOptions } from '../http'
import { httpServerStart, resolveHttpServer, resolveHttpsConfig } from '../http'
import {
httpServerStart,
resolveHttpServer,
resolveHttpsConfig,
setClientErrorHandler
} from '../http'
import type { InlineConfig, ResolvedConfig } from '../config'
import { isDepsOptimizerEnabled, resolveConfig } from '../config'
import {
Expand Down Expand Up @@ -301,6 +306,10 @@ export async function createServer(
: await resolveHttpServer(serverConfig, middlewares, httpsOptions)
const ws = createWebSocketServer(httpServer, config, httpsOptions)

if (httpServer) {
setClientErrorHandler(httpServer, config.logger)
}

const { ignored = [], ...watchOptions } = serverConfig.watch || {}
const watcher = chokidar.watch(path.resolve(root), {
ignored: [
Expand Down

0 comments on commit e8b61bb

Please sign in to comment.