在 Web 开发中，静态文件夹是我们经常用到的一种资源，如 HTML、CSS、JavaScript、图片等。 Fastify 是一个快速高效的 Node.js Web 框架，它提供了现成的解决方案来处理静态文件夹，我们在本文中来详细介绍它的用法和原理。
静态文件夹的传统解决方案
在传统的 Node.js Web 框架中，我们通常需要使用第三方中间件来处理静态文件夹。使用 express 框架为例，我们通常会这样使用中间件：
const express = require('express')
const app = express()
app.use(express.static('public'))
app.listen(3000, () => console.log('Server started'))这里的 express.static('public') 就是一个处理静态文件夹的中间件。当我们访问 localhost:3000/image.png 时，它会在 public 文件夹下查找 image.png 文件，如果找到就返回给客户端。
虽然这种方式能够很好地处理静态文件夹，但是它也有几个缺点：
- 依赖第三方中间件，如果中间件有 bug 或者不再维护，就会遇到问题。
- 无法进行优化，静态文件也会被当做普通的请求来处理，没有页面缓存等加速策略。
- 不符合 Fastify 的设计理念，Fastify 希望尽量保持简洁高效。
那么在 Fastify 中，如何处理静态文件夹呢？
Fastify 的解决方案
Fastify 提供了 fastify-static 插件来处理静态文件夹，使用它非常简单。
首先，我们需要安装 fastify-static：
npm install fastify-static --save
然后在代码中引入插件并注册：
-- -------------------- ---- ------- ----- ------- - -------------------- ----- ------------ - ------------------------------- --------- ------------------------------------------- - ----- ------------- ------- ----------- -- ------------- -- -------------------- -- -- ------------------- ----------
这里的 fastify-static 插件就是 Fastify 的解决方案，我们通过 require('fastify-static') 来引入，并在 fastify.register 中进行注册。其中 root 表示静态文件夹的根目录，prefix 是可选的前缀，可以让访问更加友好。
这样，当我们访问 localhost:3000/public/image.png 时，Fastify 就会在 public 文件夹下查找 image.png 文件，如果找到就返回给客户端。
原理分析
了解了 Fastify 解决方案的用法之后，我们也应该了解一下它的原理。这样有助于我们更好地理解和使用它。
Fastify 的静态文件夹解决方案依赖于 Node.js 中的 http.Server，具体来说是 http.Server 的 request 事件。当客户端请求静态文件夹中的资源时，http.Server 会触发 request 事件，Fastify 的 fastify-static 插件也监听了这个事件。它会根据请求路径在静态文件夹中查找对应的资源，如果找到就返回给客户端，否则会继续传递到后续的处理器中。
Fastify 的静态文件夹解决方案也支持多线程，并且可以对静态文件进行缓存优化，提高访问速度。
总结
Fastify 提供了专门的解决方案来处理静态文件夹，相比传统的 Node.js Web 框架，它更加简洁高效，并且不依赖于第三方中间件。在实际开发中，我们应该优先选择 Fastify 的解决方案来处理静态文件夹。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c278aa83d39b488167516b