Express.js：为Webpack打包的静态资源设置缓存控制头

Question

我不知道如何在使用express.js和webpack的静态资源中设置Cache-Control头。

在我的React应用程序中，我是按以下方式包括静态图像的：

 <img src={require("./images/Logo.png")} alt="Logo"/>

我在webpack.config.js中有一个加载器(loader)，它会将图像输出到 /public/images 目录下。

module: {
    loaders: [
    {
        test: /\.png/,
        loader: 'url-loader?limit=10000&name=public/images/[name].[ext]'
     }]
}

最后，我将server.js中的/public文件夹标记为包含静态资源，并设置了Cache-Control头。

const server = express();
server.use(express.static(path.join(__dirname, 'public'), {maxAge: "30d"}));

问题在于require()解析的路径是包括/public文件夹的:

<img class="full-width" src="/public/images/Logo.png" alt="Logo">

但是 express 要求的 URL 不包含 public/ 部分。

是否有一种方式可以强制 express.static() 在其路径中包含 /public ？

- Martynas Šapoka

Answer 1

有没有一种方法可以强制express.static()在其路径中包含/public？

当然有：

server.use('/public', express.static(path.join(__dirname, 'public'), {maxAge: "30d"}));

- robertklep

---

谢谢。我尝试了一下，虽然静态资源是从 /public/images URL 服务器提供的，但 Cache-Control 头并不存在。我需要一个解决方案，在这个头中包含静态资源。 - Martynas Šapoka

适用于我：Cache-Control: public, max-age=2592000。 - robertklep

我已经在另一个项目上尝试过了，确实可以工作。问题一定是出在其他地方。感谢您的帮助！ - Martynas Šapoka