全书目录

第十二篇:Express 完全指南 —— 老城区主干道宇宙

第九章:静态资源 —— 老城区公告栏和路边招牌

1 分钟 164 字 第 247 / 962 个阅读单元

Express 不只是做 API,它也能直接对外提供静态文件:

  • 图片
  • CSS
  • 前端 JS
  • 下载文件
  • 纯 HTML

这就像主干道边上的:

  • 公告栏
  • 指示牌
  • 招贴画
  • 公开表格
#1. 最基础的静态目录
js
const express = require('express');
const path = require('node:path');
const app = express();

app.use('/static', express.static(path.join(__dirname, 'public')));

目录结构:

text
project
├── app.js
└── public
    ├── css
    │   └── site.css
    ├── images
    │   └── map.png
    └── main.js

访问地址:

text
/static/css/site.css
/static/images/map.png
/static/main.js
#2. 为什么常加 /static 前缀

因为你希望“道路窗口”和“公告栏资源”分开:

text
/roads           -> 业务路口
/api/roads       -> API 路口
/static/...      -> 静态资源公告栏
#3. 静态资源的常见认知
text
express.static(...) 不是“读取一个文件再手动 res.send”
而是“挂一个专门负责公告栏发放的内建中间件”