Nginx 静态资源

本文详细介绍了Nginx配置处理静态资源的优化策略,包括静态资源类型、场景、配置语法,以及文件压缩、浏览器缓存、跨域访问和防盗链设置。重点讨论了gzip压缩、静态资源缓存控制和跨域访问的Nginx配置方法,旨在提高静态资源的传输效率和安全性。
摘要由CSDN通过智能技术生成

静态资源类型

Nginx 作为静态资源 Web 服务器部署配置, 传输⾮常的⾼效, 常常⽤于静态资源处理, 请求, 动静分离
在这里插入图片描述
⾮服务器动态运⾏⽣成的⽂件属于静态资源

类型 种类
浏览器端渲染 HTML、CSS、JS
图片 JPEG、GIF、PNG
视频 FLV MP4
文件 TXT 任意下载文件

静态资源场景

静态资源传输延迟最⼩化
在这里插入图片描述


静态资源配置语法

1.⽂件读取⾼效 sendfile
Syntax: sendfile on | off;
Default: sendfile off;
Context: http, server, location, if in location

2.提⾼⽹络传输效率 nopush
Syntax: tcp_nopush on | off;
Default: tcp_nopush off;
Context: http, server, location
作⽤: sendfile开启情况下, 提⾼⽹络包的’传输效率’

2.与 tcp_nopush 之对应的配置 tcp_nodelay
Syntax: tcp_nodelay on | off;
Default: tcp_nodelay on;
Context: http, server, location
作⽤: 在keepalive连接下,提⾼⽹络的传输’实时性’


静态资源⽂件压缩

Nginx 将响应报⽂发送⾄客户端之前可以启⽤压缩功能,这能够有效地节约带宽,并提⾼响应⾄ 客户端的速度。
在这里插入图片描述
1.gzip 压缩配置语法
Syntax: gzip on | off;
Default: gzip off;
Context: http, server, location, if in location
作⽤: 传输压缩
2.gzip 压缩⽐率配置语法

Syntax: gzip_comp_level level;
Default: gzip_comp_level 1;
Context: http, server, location
作⽤: 压缩本身⽐较耗费服务端性能
3.gzip 压缩协议版本
Syntax: gzip_http_version 1.0 | 1.1;
Default: gzip_http_version 1.1;
Context: http, server, location
作⽤: 压缩使⽤在http哪个协议, 主流版本1.1
4.扩展压缩模块
Syntax: gzip_static on | off | always;
Default: gzip_static off;
Context: http, server, location
作⽤: 预读gzip功能


图⽚压缩案例

创建网页存放目录 并使用rz上传一张动态图片

mkdir -p /soft/code/images
cd /soft/code/images/
yum -y install lrzsz
rz

在这里插入图片描述
在这里插入图片描述

vi /usr/local/nginx/conf/nginx.conf
    server {
   
        listen       80;
        server_name  192.168.1.1;

        location ~ .*\.(jpg|gif|png)$ {
   
            sendfile on;
            gzip_http_version 1.1;
            gzip_comp_level 9;
            gzip_types text/plain application/json application/x-javascript application/css application/xml application/xml+rss text/javascript application/x-httpd-php image/jpeg image/gif image/png;
            root   /soft/code/images;
            index  index.html index.htm;
        }        

在这里插入图片描述

systemctl restart nginx     ##重启nginx服务

访问:
http://192.168.1.1/1.gif
在这里插入图片描述
然后打开Fiddler 4进行抓包
下载地址点击获取
提取码:t9tj

没有开启 gzip 图⽚压缩
在这里插入图片描述
启⽤ gzip 压缩图⽚后(由于图⽚之前压缩过, 所以压缩⽐率不太明显)
在这里插入图片描述
在这里插入图片描述


⽂件压缩

nginx静态资源配置是指配置nginx服务器以便访问和处理静态文件。静态文件包括图片、HTML、CSS、JavaScript等文件。配置nginx静态资源访问需要修改nginx.conf文件。该文件的路径通常是在/usr/local/nginx/conf/nginx.conf。 要配置nginx静态文件的访问,需要进行以下步骤: 1. 打开终端并使用vim编辑器打开nginx.conf文件:`vim /usr/local/nginx/conf/nginx.conf`。 2. 在nginx.conf文件中找到root配置,该配置指定了nginx静态文件的地址。通过修改root配置,可以设置nginx服务器的根目录,即静态文件的存放位置。 3. 在root配置中指定静态文件的路径。根据具体情况设置正确的路径,确保nginx能够正确找到静态文件。例如,可以将路径设置为`/var/www/html`。 4. 保存并关闭nginx.conf文件。 通过以上配置,nginx服务器就可以访问和处理静态文件。可以通过浏览器或其他HTTP客户端来访问nginx服务器上的静态文件。请注意,配置nginx静态资源访问可能还涉及其他配置,如缓存和静态文件压缩等。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [nginx 静态资源配置](https://blog.csdn.net/alan_jj_wang/article/details/120531000)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* [四、nginx静态文件的配置](https://blog.csdn.net/Ajekseg/article/details/126081035)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小张的学习笔记

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值