如何使用 express.static 中间件提供静态文件服务？

推荐答案

// www.javascriptcn.com code example
const express = require('express');
const app = express();

// 使用 express.static 中间件提供静态文件服务
app.use(express.static('public'));

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

本题详细解读

1. express.static 中间件的作用

express.static 是 Express 框架提供的一个内置中间件，用于提供静态文件服务。它可以将指定目录下的文件（如 HTML、CSS、JavaScript、图片等）直接提供给客户端。

2. 使用 express.static 的步骤

• 引入 Express 模块：首先需要引入 express 模块。
• 创建 Express 应用：通过 express() 创建一个 Express 应用实例。
• 指定静态文件目录：使用 express.static 中间件，并传入静态文件所在的目录路径（如 'public'）。
• 启动服务器：通过 app.listen 方法启动服务器，监听指定的端口（如 3000）。

3. 示例代码解析

• app.use(express.static('public'))：这行代码告诉 Express，public 目录下的文件是静态文件，可以直接通过 URL 访问。例如，如果 public 目录下有一个 index.html 文件，那么可以通过 http://localhost:3000/index.html 访问它。
• app.listen(3000, ...)：这行代码启动服务器，并监听 3000 端口。当服务器启动后，控制台会输出 Server is running on port 3000。

4. 注意事项

• 路径问题：express.static 中间件会根据请求的 URL 路径来查找文件。例如，如果请求的 URL 是 /images/logo.png，Express 会在 public 目录下查找 images/logo.png 文件。
• 安全性：确保静态文件目录中不包含敏感文件，因为 express.static 会将目录下的所有文件公开。
• 缓存：默认情况下，Express 会启用静态文件的缓存机制，以提高性能。如果需要禁用缓存，可以在 express.static 中设置 cacheControl 选项为 false。