Examples
静态资源
提供静态资源服务，例如 HTML、图片、CSS、JavaScript 等。
h3 可以提供静态资源服务，如 HTML、图片、CSS、JavaScript 等。
要提供一个静态目录，你可以使用 serveStatic 工具。
import { H3, serveStatic } from "h3";
const app = new H3();
app.use("/public/**", (event) => {
return serveStatic(event, {
getContents: (id) => {
// TODO
},
getMeta: (id) => {
// TODO
},
});
});
这段代码还未提供任何文件服务。你需要实现 getContents 和 getMeta 方法。
getContents用于读取文件内容。它应该返回一个Promise，解析为文件内容，如果文件不存在则为undefined。getMeta用于获取文件元信息。它应该返回一个Promise，解析为文件的元数据，如果文件不存在则为undefined。
这两个方法分开设计是为了让 h3 可以响应 HEAD 请求而无需读取文件内容，同时支持使用 Last-Modified 头。
读取文件
现在，在 public 目录中创建一个包含简单消息的 index.html 文件，并在浏览器中打开 http://localhost:3000 。你应该可以看到该消息。
接下来，我们可以实现 getContents 和 getMeta 方法：
import { stat, readFile } from "node:fs/promises";
import { join } from "node:path";
import { H3, serve, serveStatic } from "h3";
const app = new H3();
app.use("/public/**", (event) => {
return serveStatic(event, {
indexNames: ["/index.html"],
getContents: (id) => readFile(join("public", id)),
getMeta: async (id) => {
const stats = await stat(join("public", id)).catch(() => {});
if (stats?.isFile()) {
return {
size: stats.size,
mtime: stats.mtimeMs,
};
}
},
});
});
serve(app);
getContents 读取文件并返回其内容，非常简单。getMeta 使用 fs.stat 获取文件元数据。如果文件不存在或不是文件，返回 undefined。否则返回文件大小和最后修改时间。
文件大小和最后修改时间用于生成 etag，以便如果文件自上次请求以来没有被修改，则发送 304 Not Modified 响应。这对于避免发送未更改的文件非常有用。