在前端开发中，我们经常需要使用静态文件服务来提供网站的静态资源，如 HTML、CSS、JavaScript、图片等。Deno 是一种新的 JavaScript 运行时环境，它提供了一种简单的方法来处理静态文件服务。
Deno 静态文件服务
Deno 内置了一个简单的静态文件服务，可以通过 Deno 对象的 serveStatic 方法来使用。该方法需要传入一个 path 参数来指定要提供静态文件服务的目录。例如，以下代码将在本地 8080 端口上提供当前目录下的静态文件服务：
import { serveStatic } from "https://deno.land/std/http/file_server.ts";
const server = serveStatic(".");
console.log("http://localhost:8080/");
for await (const req of server) {
req.respond();
}在上面的代码中，我们首先使用 import 语句导入 Deno 内置模块中的 serveStatic 方法。然后，我们使用该方法创建一个静态文件服务并将其绑定到本地 8080 端口。最后，我们使用一个 for-await-of 循环来监听客户端请求，并使用 respond() 方法来响应请求。
指定 MIME 类型
默认情况下，Deno 的静态文件服务会根据文件扩展名自动设置响应的 MIME 类型。例如，.html 文件将被设置为 text/html 类型，.css 文件将被设置为 text/css 类型，以此类推。
如果您需要指定自定义的 MIME 类型，可以通过 serveStatic 方法的第二个参数来实现。例如，以下代码将在本地 8080 端口上提供当前目录下的静态文件服务，并将所有的 .txt 文件设置为 text/plain 类型：
import { serveStatic } from "https://deno.land/std/http/file_server.ts";
const server = serveStatic(".", { ".txt": "text/plain" });
console.log("http://localhost:8080/");
for await (const req of server) {
req.respond();
}在上面的代码中，我们将第二个参数传递给 serveStatic 方法，该参数是一个对象，其中键是文件扩展名，值是对应的 MIME 类型。
定制 404 页面
当客户端请求一个不存在的文件时，Deno 的静态文件服务将返回一个 404 Not Found 响应。如果您需要定制这个响应的内容，可以通过 serveStatic 方法的第三个参数来实现。例如，以下代码将在本地 8080 端口上提供当前目录下的静态文件服务，并将所有的 404 响应重定向到 /404.html 页面：
import { serveStatic } from "https://deno.land/std/http/file_server.ts";
const server = serveStatic(".", {}, { "/404": "/404.html" });
console.log("http://localhost:8080/");
for await (const req of server) {
req.respond();
}在上面的代码中，我们将第三个参数传递给 serveStatic 方法，该参数是一个对象，其中键是要重定向的 URL，值是重定向到的页面路径。
总结
Deno 的静态文件服务提供了一种简单的方法来处理网站的静态资源。通过使用 serveStatic 方法，我们可以轻松地将任何目录转换为静态文件服务，并对 MIME 类型和 404 响应进行定制。希望本文能够对您在前端开发中使用 Deno 处理静态文件服务有所帮助。
完整示例代码：https://github.com/denoland/deno_std/blob/main/http/file_server.ts
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/658088f6d2f5e1655dbb831e