3. egg 静态资源及缓存设置

1. egg 默认自动继承静态资源配置，在public文件夹
2. 通过 egg-static链接:https://github.com/eggjs/egg-static模块实现。
3. 支持 koa-static-cache链接:https://github.com/koajs/static-cache所有配置

1. 使用方法

在项目根目录下的app文件夹下创建public文件夹，默认该文件夹为静态文件存放目录

2. 如何访问静态资源

如下所示静态资源，可以通过http://127.0.0.1:7001/public/images/logo.png进行访问；

app/public
|--images
    |--logo.png

3. 默认参数配置

egg-static support all configurations in koa-static-cache. and with default configurations below:

• prefix: '/public/'

访问静态化的url前缀

• dir: path.join(appInfo.baseDir, 'app/public')

需要设置静态化的目录

• dynamic: true

如果当前访问的静态资源没有缓存，则缓存静态文件，和preload配合使用；

• preload: false

项目启动的时候是否需要将静态资源缓存，和dynamic配合使用；

• maxAge: 31536000 in prod env, 0 in other envs

默认在prod环境缓存31536000秒，其他环境0秒（不缓存,防止修改代码后给自己挖坑）；

• buffer: true in prod env, false in other envs

是否将缓存文件保存在内存中（默认生产环境会缓存，其他环境实时读取）

如：
我的配置如下：

  // static files and cache files
  config.static = {
    // 静态化访问前缀,如：`http://127.0.0.1:7001/static/images/logo.png`
    prefix: '/static', 
    dir: path.join(appInfo.baseDir, 'app/public'), // `String` or `Array:[dir1, dir2, ...]` 静态化目录,可以设置多个静态化目录
    dynamic: true, // 如果当前访问的静态资源没有缓存，则缓存静态文件，和`preload`配合使用；
    preload: false,
    maxAge: 31536000, // in prod env, 0 in other envs
    buffer: true, // in prod env, false in other envs
  };

效果如下：

这是第一次访问的，可以看到status是200，缓存的文件目录是public，缓存有效期是31536000秒；

image.png

当我第二次刷新的时候，状态就是304了，会一直读取缓存中的main.js，如果不强制刷新或者清除缓存或者重启项目等因素，则在31536000秒内会一直读取缓存；

image.png

4. 其他选项配置

官网都有，再次偷懒了，egg-static支持static-cache所有选项，以下部分参数上面已经提过了（egg-static默认的参数），以下是直接复制的，相信前端童靴英语水平是可以看懂的，实在看不懂的点这里：https://fanyi.baidu.com/

static-cache详见：https://github.com/koajs/static-cache

• dir (str) - the directory you wish to serve, priority than options.dir.
• options.dir (str) - the directory you wish to serve, default to process.cwd.
• options.maxAge (int) - cache control max age for the files, 0 by default.
• options.cacheControl (str) - optional cache control header. Overrides + options.maxAge.
• options.buffer (bool) - store the files in memory instead of streaming from the filesystem on each request.
• options.gzip (bool) - when request's accept-encoding include gzip, files will compressed by gzip.
• options.usePrecompiledGzip (bool) - try use gzip files, loaded from disk, like nginx gzip_static
• options.alias (obj) - object map of aliases. See below.
• options.prefix (str) - the url prefix you wish to add, default to ''.
• options.dynamic (bool) - dynamic load file which not cached on initialization.
• options.filter (function | array) - filter files at init dir, for example - skip non build (source) files. If array set - allow only listed files
• options.preload (bool) - caches the assets on initialization or not, default to true. always work together with options.dynamic.
• options.files (obj) - optional files object. See below.
  files (obj) - optional files object. See below.

5. maxFiles选项

egg-static 提供了一个static-cache没有的参数，如下:

• maxFiles: the maximum value of cache items, only effective when dynamic is true, default is 1000.

注意事项

如果要使用项目中的静态文件，一定要注意官方默认在生产环境会将静态资源缓存，防止上线后坑了自己，官方静态资源处理的基本很好了，个人感觉只需要改 prefix,dir,maxAge3个参数就好

• prefix 可能需要跟运维小伙伴商量，防止nginx做代理出问题
• dir 静态文件存放的可能不只是public一个目录
• maxAge 官方默认31536000秒（一年）感觉有点长啊，可以适当修改

config.static = {
    prefix: '/static', 
    dir: path.join(appInfo.baseDir, 'app/public'), 
    maxAge: 31536000,
  };

相关原文

All static files in $baseDir/app/public can be visited with prefix /public, and all the files are lazy loaded.

• In non-production environment, assets won't be cached, your modification can take effect immediately.
• In production environment, egg-static will cache the assets after visited, you need to restart the process to update the assets.
• Dir default is $baseDir/app/public but you can also define multiple directory by use dir: [dir1, dir2, ...] and static server will use all these directories.