Static asset hosting
Serve browser assets such as HTML, CSS, JavaScript, and images from a public directory.
Express.js · Function
serveStatic
serveStatic(root, options) creates middleware that serves files from a root directory based on the request URL. Missing files fall through to next(), allowing fallback middleware or multiple static directories.
How it works
Calling serveStatic with a root directory creates middleware that maps the request URL onto that directory and serves a matching file. If no file matches, it calls next() rather than ending the request, so multiple static directories or fallback handlers can be composed.
Syntax
serveStatic(root, options)Parameters
| Name | Type | Description |
|---|---|---|
root | string | Filesystem root directory from which requested files are served. |
options | object | Optional configuration, including index, extensions, and setHeaders behavior. |
Returns
A middleware function that serves files from the specified root and calls next() when a file is not found.
Key points
- The function creates middleware for serving files beneath the supplied root directory.
- A request URL is combined with the root to locate the file that should be served.
- A missing file falls through to the next middleware, enabling fallback handlers and stacked static roots.
- The extensions option can try alternate filename extensions when the original file is absent.
- When extension fallbacks are configured, the first existing candidate is returned.
- The setHeaders option provides a callback for applying custom response headers.
Common mistakes
- A missing file is passed to the next middleware rather than producing a 404 response here.
- Directory requests serve index.html by default; change or disable this with the index option.
- A setHeaders callback must modify response headers synchronously.
Example: Serve a public directory
const express = require('express');
const path = require('path');
const serveStatic = require('serve-static');
const app = express();
app.use(serveStatic(path.join(__dirname, 'public')));
app.listen(3000);Serves files from the absolute public directory and lets later middleware handle requests for missing files.
When to use it
Fallback resolution
Try a second directory or route handler after the first static location has no matching file.
Custom response headers
Apply cache-control or other response headers while serving files.
Interview questions
QWhat does serveStatic do when a requested file is absent?
serveStatic(root, options) returns middleware that serves files below root. It combines the request URL with root, and calls next() when no file is found.
Follow-up: How can static fallbacks be composed? Mount multiple serveStatic instances in sequence; a miss in one allows the next middleware to try.
QWhat is the purpose of the root argument?
The root directory is the base used to locate requested files. The middleware uses the request URL together with that root to determine which file to send.
Follow-up: How should an application serve a directory reliably regardless of its launch directory? Resolve or construct an absolute root path before passing it to serveStatic.
QHow does the index option affect directory requests?
The index option controls directory requests. By default index.html is sent; false disables index serving, while a string or ordered array selects alternative names.
Follow-up: How could different default documents be tried in order? Pass an array such as ['default.html', 'default.htm'] as index.
Related
express.staticserve-indexexpress