资讯专栏INFORMATION COLUMN

nginx配置中开启gzip来压缩网页文件提高网站速度

stonezhu / 2636人阅读

摘要:如何开启来压缩网页文件提高网站速度要知道网站的打开速度取决于浏览器打开下载的网页文件大小。你可以在配置中开启来压缩网页文件。默认情况下,仅压缩文件。服务器上设置站点上设如何在中开启压缩服务让网页速度更快服务器设置压缩是开发里很普遍的做法。

nginx如何开启gzip来压缩网页文件提高网站速度?要知道网站的打开速度取决于浏览器打开下载的网页文件大小。如果传输的页面内容文件减少,那你网站的打开速度一定会加快。特别是手机端的用户,打开网站速度受限于移动端网络,所以压缩网站页面内容显得至关重要。

 

gzip是一种非常流行的数据压缩方式。你可以在nginx配置中开启gzip来压缩网页文件。然后,这些文件又由浏览器解压缩,文件不会受任何。但是压缩文件是会占用服务器资源,所以最好压缩那些效果比较好的文件。比如文本文件压缩效果非常好,通常会缩小两倍多。而JPG或PNG这类文件,本身就已经进行格式压缩,所以再做二次压缩,效果并不是特别明显。

本文主要讲一下如何配置nginx来开启gzip压缩。

环境:

ubuntu 20.04服务器

root权限或具有sudo特权的非root用户

一、创建测试文件

在这一步中,我们将在默认的Nginx目录中创建几个测试文件。稍后我们将使用这些文件来检查Nginx的默认行为是否进行gzip压缩,并测试配置更改是否具有预期的效果。

首先,创建几个测试文件,这些文件主要用来查看我们的gzip压缩效果。gzip是不会分析文件内容的,它主要通过文件扩展名来判断文件类型,如果还分析文件内容,那整个效率就会大大降低。所以我们可以创建一些图像文件、html文件和一些样式文件。

sudo truncate -s 1k /var/www/html/test.html

sudo truncate -s 1k /var/www/html/test.jpg

sudo truncate -s 1k /var/www/html/test.css

sudo truncate -s 1k /var/www/html/test.js

下一步是检查Nginx在使用我们刚创建的文件在全新安装中压缩请求的文件时的行为。

二、命令方式查看压缩效果

使用curl命令方式,添加标头Accept-Encoding: gzip,来查看各文件的压缩结果。

curl -H “Accept-Encoding: gzip” -I http://localhost/test.html

可以看到以下结果:

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:04:25 GMT

Content-Type: text/html

Last-Modified: Tue, 09 Feb 2021 19:03:41 GMT

Connection: keep-alive

ETag: W/”6022dc8d-400″

Content-Encoding: gzip

在最后一行,出现Content-Encoding: gzip字样。说明服务器正在用gzip压缩来发送文件。默认情况下,nginx仅压缩html文件。所有在这个命令中可以看到文件做了压缩处理。但其它的文件格式,并未做压缩处理。

可以通过下面这条命令来验证我们刚才的说法。

curl -H “Accept-Encoding: gzip” -I http://localhost/test.jpg

再看一下结果,和之前的有所不同:

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:05:49 GMT

Content-Type: image/jpeg

Content-Length: 1024

Last-Modified: Tue, 09 Feb 2021 19:03:45 GMT

Connection: keep-alive

ETag: “6022dc91-400”

Accept-Ranges: bytes

输出结果中没有出现Content-Encoding: gzip,这意味着该文件并没有做任何的压缩。

你也可以使用这个方法来测试css等样式文件。

curl -H “Accept-Encoding: gzip” -I http://localhost/test.css

结果一样,没有出现Content-Encoding: gzip

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:06:04 GMT

Content-Type: text/css

Content-Length: 1024

Last-Modified: Tue, 09 Feb 2021 19:03:45 GMT

Connection: keep-alive

ETag: “6022dc91-400”

Accept-Ranges: bytes

三、配置Nginx开启gzip功能

本节主要操作相关配置,让gzip可以处理其它几种文件格式的压缩。

你可以使用nano或vim编辑nginx的配置文件。

sudo nano /etc/nginx/nginx.conf

找到gzip设置部分,如下所示:

/etc/nginx/nginx.conf

. . .

##

# `gzip` Settings

#

#

gzip on;

gzip_disable “msie6”;

# gzip_vary on;

# gzip_proxied any;

# gzip_comp_level 6;

# gzip_buffers 16 8k;

# gzip_http_version 1.1;

# gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;

. . .

因为我们用的是ubuntu 20.04。所以默认情况下,gzip是开启的。但有些设置无效,所以我们需要做一些修改:

通过取消注释行前面的#来启用其他设置(即,删除#符号)

添加gzip_min_length 256;参数,该参数是告诉nginx,不要去压缩小于256字节的文件,因为很小的文件没有太必要。压缩这类文件反而影响服务器效率。

在gzip_types参数中添加其他文件类型扩展名,这些文件类型可以是Web字体,图片、XML、JSON结构化数据或SVG图片文件。

应用这些更改之后,设置部分应如下所示:

/etc/nginx/nginx.conf

. . .

##

# `gzip` Settings

#

#

gzip on;

gzip_disable “msie6”;

gzip_vary on;

gzip_proxied any;

gzip_comp_level 6;

gzip_buffers 16 8k;

gzip_http_version 1.1;

gzip_min_length 256;

gzip_types

application/atom+xml

application/geo+json

application/javascript

application/x-javascript

application/json

application/ld+json

application/manifest+json

application/rdf+xml

application/rss+xml

application/xhtml+xml

application/xml

font/eot

font/otf

font/ttf

image/svg+xml

text/css

text/javascript

text/plain

text/xml;

. . .

保存并关闭文件以退出。要启用新配置,需要重新启动Nginx:

sudo systemctl restart nginx

四、确保所有的配置正确

重复之前的测试步骤,执行相应的命令请求:

curl -H “Accept-Encoding: gzip” -I http://localhost/test.html

因为html文件,之前已经默认开启压缩,所以这个命令执行结果保持不变:

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:04:25 GMT

Content-Type: text/html

Last-Modified: Tue, 09 Feb 2021 19:03:41 GMT

Connection: keep-alive

ETag: W/”6022dc8d-400″

Content-Encoding: gzip

然后我们来测试一下之前未压缩的css样式表,看看结果会有什么变化:

curl -H “Accept-Encoding: gzip” -I http://localhost/test.css

可以看到gzip正在压缩文件:

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:21:54 GMT

Content-Type: text/css

Last-Modified: Tue, 09 Feb 2021 19:03:45 GMT

Connection: keep-alive

Vary: Accept-Encoding

ETag: W/”6022dc91-400″

Content-Encoding: gzip

我们可以用相同的方式测试一下jpg文件:

curl -H “Accept-Encoding: gzip” -I http://localhost/test.jpg

没有看到gzip压缩:

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:25:40 GMT

Content-Type: image/jpeg

Content-Length: 1024

Last-Modified: Tue, 09 Feb 2021 19:03:45 GMT

Connection: keep-alive

ETag: “6022dc91-400”

Accept-Ranges: bytes

因为在之前的配置中,我们并没有添加 image/jpeg。

在这种情况下,我们已经在Nginx中成功配置了gzip。

结论:

可以看出,gzip很容易配置,而且带来的速度提升也非常明显,搜索引擎也非常喜欢这类加载方式,如果想提高搜索引擎的排名,增加gzip是非常有必要的。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/119047.html

相关文章

  • PHP面试之二:高并发与大数据

    摘要:三态分别是就绪运行阻塞进程的五态模型在三态的基础上发展而来新建态运行态终止态就绪态等待态线程称之为轻量级的进程,程序执行流的最小单元。一个进程下有多个线程来完成不同的工作称之为多线程。 web资源防盗链 盗链是什么? 为什么要防? 在自己页面上显示一些不是自己服务器的资源(图片、音频、视频、css、js等)由于别人盗链你的资源会加重你的服务器负担,所以我们需要防止可能会影响统计 防盗链...

    Ashin 评论0 收藏0
  • 一次网站的性能优化之路 -- 天下武功,唯快不破

    摘要:百度搜索资源平台有闪电算法的支持,为了能够保障用户体验,给予优秀站点更多面向用户的机会,闪电算法在年月初上线。下栏是每一个指标的细化性能评估。最后优化之路漫漫,永无止境,天下武功,唯快不破。 showImg(https://segmentfault.com/img/remote/1460000018537491); 首屏作为直面用户的第一屏,其重要性不言而喻,如何加快加载的速度是非常重...

    mudiyouyou 评论0 收藏0
  • 优化Laravel网站打开速度

    摘要:开启压缩在服务器开启压缩是优化网站性能的方法之一,可以有效减少服务器带宽的消耗,缺点是会增大的占用率,但是很多时候往往是空闲最多的。通过浏览器判断是否开启压缩如,打开一个网页,打开控制栏,如图字段是,表示该网页是经过压缩的。 1.关闭debug 打开.env文件,把debug设置为false. APP_ENV=local APP_DEBUG=false APP_KEY=base64:6...

    newtrek 评论0 收藏0
  • Nginx配置参数文说明

    摘要:此篇文章参照配置参数中文详细说明一文,动手操作整理文档,尽可能的详尽。这里在主机上通过浏览器访问这个站点的时候,会根据来访的主机的值,负载均衡到和服务器上。如果其中一个服务器无效后,负载均衡服务器会自动将请求转发到正常的服务器。 此篇文章参照Nginx配置参数中文详细说明一文,动手操作整理文档,尽可能的详尽。 Nginx配置参数中文详细说明 #定义Nginx运行的用户和用户组 user...

    bawn 评论0 收藏0
  • nginx安装配置|nginx负载均衡|nginx反向代理|gzip压缩|expires缓存

    摘要:是一款轻量级的服务器反向代理服务器及电子邮件代理服务器,并在一个协议下发行。是以反向代理的方式进行负载均衡的。 Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器,并在一个BSD-like 协议下发行。由俄罗斯的程序设计师Igor Sysoev所开发,供俄国大型的入口网站及搜索引擎Rambler(俄文:Рамблер)使用。其特点是占有内存...

    pkhope 评论0 收藏0

发表评论

0条评论

stonezhu

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<