从koa-static中间件学习搭建静态文件服务器

Posted jlfw

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了从koa-static中间件学习搭建静态文件服务器相关的知识,希望对你有一定的参考价值。

从koa-static中间件学习搭建静态文件服务器

原文地址

koa-send

Static file serving middleware

koa-static中有说明它只是koa-send的一个包装

const send = require(‘koa-send‘);

app.use(async (ctx) => {
  await send(ctx, ctx.path, { root: __dirname + ‘/public‘ });
})

查看koa-send的源码可以发现,它做的工作是根据传入的path查找文件是否存在,如果存在就创建一个流,不存在就抛出错误。

send函数可以传入第三个参数

  • maxage Browser cache max-age in milliseconds. (defaults to 0)
  • immutable Tell the browser the resource is immutable and can be cached indefinitely. (defaults to false)
  • hidden Allow transfer of hidden files. (defaults to false)
  • root Root directory to restrict file access.
  • index Name of the index file to serve automatically when visiting the root location. (defaults to none)
  • gzip Try to serve the gzipped version of a file automatically when gzip is supported by a client and if the requested file with .gz extension exists. (defaults to true).
  • brotli Try to serve the brotli version of a file automatically when brotli is supported by a client and if the requested file with .br extension exists. (defaults to true).
  • format If not false (defaults to true), format the path to serve static file servers and not require a trailing slash for directories, so that you can do both /directory and /directory/.
  • setHeaders Function to set custom headers on response.
  • extensions Try to match extensions from passed array to search for file when no extension is sufficed in URL. First found is served. (defaults to false)

可以看一下index的作用,事实上当我们在地址栏输入

http://www.aaa.com/
或者
http://www.aaa.com/index.html

可以发现效果是一样的,原因就是配置了index选项,服务端首先检查你的path是否以 ‘/‘ 结尾,假如你配置了index选项且以 ‘/‘ 结尾,那么服务端会自动将你的path和index选项拼接,如下:

const trailingSlash = path[path.length - 1] === ‘/‘

...

if (index && trailingSlash) path += index

再看一下format的作用,其实我们经常在地址栏输入的是

http://www.aaa.com
而不是
http://www.aaa.com/

但他们的效果也是一样的,原因就是配置了format,经过resolve之后的path返回的是一个绝对路径,它是其中一种状态(文件或者文件夹),如果是文件夹,且设置了format(默认为true)和index,那么就自动添加index

    stats = await fs.stat(path)

    // Format the path to serve static file servers
    // and not require a trailing slash for directories,
    // so that you can do both `/directory` and `/directory/`
    if (stats.isDirectory()) {
      if (format && index) {
        path += ‘/‘ + index
        stats = await fs.stat(path)
      } else {
        return
      }
    }

extensions的作用好像不多见,比如你的a文件夹

| - a
    | - demo.txt
    | - demo.json
    | - demo.html

假如你设置了extensions(假设为[‘json‘, ‘txt‘]),那么你在地址栏输入


http://www.aaa.com/a/demo

事实上等同于
http://www.aaa.com/a/demo.json

服务端会首先判断你是否设置了extensions且path不以 ‘.**‘ 结尾

  if (extensions && !/..*$/.exec(path)) {
    const list = [].concat(extensions)
    for (let i = 0; i < list.length; i++) {
      let ext = list[i]
      if (typeof ext !== ‘string‘) {
        throw new TypeError(‘option extensions must be array of strings or false‘)
      }
      // [‘.js‘] 或者 [‘js‘] 均可以
      if (!/^./.exec(ext)) ext = ‘.‘ + ext
      if (await fs.exists(path + ext)) {
        path = path + ext
        break
      }
    }
  }

然后按照extensions的顺序依次查找拼接的path是否存在,存在即停止查找

koa-static

koa-static的只是给koa-send包了一层,koa-send的第二个参数path是ctx.path

koa-static有个defer选项

  • defer If true, serves after return next(), allowing any downstream middleware to respond first.
  if (!opts.defer) {
    return async function serve (ctx, next) {
      let done = false

      if (ctx.method === ‘HEAD‘ || ctx.method === ‘GET‘) {
        try {
          // koa-send 输入的path不存在时抛错(404或者500)
          done = await send(ctx, ctx.path, opts)
        } catch (err) {
          // 如果错误码是404说明请求的不是静态文件
          if (err.status !== 404) {
            throw err
          }
        }
      }

      //  请求不是静态文件  继续执行下面的逻辑
      if (!done) {
        await next()
      }
    }
  }

  return async function serve (ctx, next) {
    await next()

    // 假如请求方法不是get  必然不是访问静态资源
    if (ctx.method !== ‘HEAD‘ && ctx.method !== ‘GET‘) return
    // 说明对请求已经做了响应
    if (ctx.body != null || ctx.status !== 404) return // eslint-disable-line

    try {
      await send(ctx, ctx.path, opts)
    } catch (err) {
      if (err.status !== 404) {
        throw err
      }
    }
  }

本文转载于:猿2048https://www.mk2048.com/blog/blog.php?id=h1ikj2bibaa

以上是关于从koa-static中间件学习搭建静态文件服务器的主要内容,如果未能解决你的问题,请参考以下文章

使用Koa2进行Web开发静态文件与路由

使用Koa2进行Web开发静态文件与路由

koa2 从入门到进阶之路

koa学习之路七

Koa中间件 --- koa-static

koa 核心拓展——中间件机制