nginx开启gzip

Posted 2023-05-04 北风几吹夏

在进行生产环境部署时，开启 Gzip 压缩可以减小静态资源文件的大小，提高网站的加载速度。

如果要使用 Gzip 压缩技术来减小文件传输大小，需要在两个地方进行配置。

首先，在本地开发环境中，你需要使用一些工具来对需要传输的文件构建压缩版本，比如使用 webpack 构建并压缩 JavaScript 脚本，使用 Gulp 压缩 CSS 样式表或者图片等，这样可以在编译阶段对文件进行一次压缩。

在 Vite 的打包配置文件 vite.config.js 中，可以通过设置 server.compression 来开启 Gzip 压缩。示例代码如下：

import viteCompression from \'vite-plugin-compression\';

export default 
  // ...
  plugins: [
    // 开启 Gzip 压缩
    viteCompression(
      verbose: true,
      disable: false,
      threshold: 10240, // 文件大小大于该值才启用压缩，单位是字节
      algorithm: \'gzip\', // 使用 gzip 压缩
      ext: \'.gz\',
    ),
  ],
;

在以上配置中，threshold 表示只有在文件大小大于 10240 字节（即 10KB）时，才会使用 Gzip 压缩进行压缩。如果你希望所有文件都开启 Gzip 压缩，可以将该值设为 0。

其次，在部署的服务器上也需要开启 Gzip 压缩。当服务器收到浏览器的请求后，如果请求头包含了 Accept-Encoding: gzip，服务器会返回已经使用 Gzip 压缩过后的文件；否则，服务器会返回未经压缩的文件。你可以通过在 Nginx 或 Apache 配置文件中添加相关配置来开启 Gzip 压缩功能。

#gzip  on;
gzip on;
gzip_comp_level 6;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
gzip_vary on;
gzip_http_version 1.1;

需要注意的是，在部署的服务器上开启 Gzip 压缩功能可能会增加 CPU 的负载，因为服务器需要实时压缩文件并且生成压缩后的版本，但是这个压力对于现代计算机来说通常是可以承受的，在提高传输速度和优化网站性能方面，Gzip 压缩仍然是一种非常有效的技术。

箴言：因为这些东西是非常简单的。不要抱怨自己学不会，那是因为你没有足够用心。

nginx开启gzip压缩和静态缓存

nginx实现资源压缩的原理是通过ngx_http_gzip_module模块拦截请求，并对需要做gzip的类型做gzip压缩，该模块是默认基础的，不需要重新编译，直接开启即可。

基本配置

# 开启gzip

gzip on;

# 启用gzip压缩的最小文件，小于设置值的文件将不会压缩

gzip_min_length 1k;

# gzip 压缩级别，1-9，数字越大压缩的越好，也越占用CPU时间，后面会有详细说明

gzip_comp_level 1;

# 进行压缩的文件类型。javascript有多种形式。其中的值可以在 mime.types 文件中找到。

gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png application/vnd.ms-fontobject font/ttf font/opentype font/x-woff image/svg+xml;

# 是否在http header中添加Vary: Accept-Encoding，建议开启

gzip_vary on;

# 禁用IE 6 gzip

gzip_disable "MSIE [1-6]\\.";

# 设置压缩所需要的缓冲区大小      

gzip_buffers 32 4k;

# 设置gzip压缩针对的HTTP协议版本，没做负载的可以不用

# gzip_http_version 1.0;