节点express Server不使用brotli和gzip压缩提供压缩的静态文件

我已经使用对可加载的SSR插件npm包进行了响应，以实现SSR。 / a>。

I have react app with SSR implementation using react loadable SSR addon npm package.

我正在按照本教程实施brotli和gzip压缩

I am following this tutorial A Tale of Brotli Compression to implement brotli and gzip compression

我可以在build文件夹中看到.br和.gzip压缩文件。但是当我在localhost上检查时这些文件不起作用，我不确定是否是因为我在localhost开发服务器上检查东西或其他。

I can see .br and .gzip compressed files in build folder. but these file do not serve when I check on localhost, I am not sure whether it is because I am checking on localhost development server or something else.

以下步骤：

webpackConfig / plugins.js

const CompressionPlugin = require('compression-webpack-plugin');
const BrotliPlugin = require('brotli-webpack-plugin');

  new CompressionPlugin({
    filename: '[path].gz[query]',
  }),
  new BrotliPlugin({
    asset: '[path].br[query]',
    test: /\.(js|css|html|svg)$/,
    threshold: 10240,
    minRatio: 0.8,
  }),

server / index.js

import expressStaticGzip from 'express-static-gzip';
import path from 'path';

const server = express();
server.use(cors());
server.use(bodyParser.json());
server.use(bodyParser.urlencoded({ extended: false }));
server.use(cookieParser());
server.use(
  '/static*',
  // '/build/client',
  expressStaticGzip(path.join(paths.clientBuild, paths.publicPath), {
    enableBrotli: true,
    orderPreference: ['br', 'gz'],
    setHeaders(res) {
      res.setHeader('Content-Encoding', 'br');
      res.setHeader('Cache-Control', 'public, max-age=31536000');
    },
  })
);

server.use(
  '/static*',
  expressStaticGzip(path.join(paths.serverBuild, paths.publicPath), {
    enableBrotli: true,
    orderPreference: ['br', 'gz'],
    setHeaders(res) {
      res.setHeader('Content-Encoding', 'br');
      res.setHeader('Cache-Control', 'public, max-age=31536000');
    },
  })
);
server.use(compression());

start.js

// app.use（'/ static'， express.static（paths.clientBuild））;

// app.use('/static', express.static(paths.clientBuild));

在上述start.js中的代码中进行了注释。

commented above code in start.js.

在浏览器中，我看到的大小相同

In the browser, I see the same size of static JS and CSS files as before.

更新：

尝试了几件事之后，我明白我需要在start.js而不是server / index.js中进行更改

After trying a few things I understood that I need to make changes in start.js and not server/index.js

因此，为了测试事情是否按预期进行，我添加了一个中间件来测试特定的用例：

Therefore to test if things are working as expected I added a middleware to test specific use case:

 app.get('/static*', function (req, res, next) {
    console.log('req buncle url', req.url)
     req.url = req.url + '.gz';
    res.set('Content-Encoding', 'gzip');
    res.set('Content-Type', 'text/javascript');
    next();
  });

上面的代码按预期工作，我在浏览器中压缩了bundle.js文件。

The above code worked as expected, I got compressed bundle.js file in a browser. but same does not work with express-static-gzip.

仅供参考：我的build文件夹位于根目录下，结构如下：

FYI: My build folder is on root and has below structure:

build / client / static /

build/client/static/