：Nginx設(shè)置了反向代理時如何開啟緩存網(wǎng)站的圖片/CSS/JS文件和注意事項

這是我的完整代碼，啟用后網(wǎng)站的“jpg|jpeg|png|gif|ico|css|js”文件全部都無法顯示，請幫忙看看問題出在哪：

# 代理站點
server {
	listen 80;
	server_name oa22.cn *.oa22.cn; # 匹配所有二級域名
	
	# 緩存靜態(tài)文件
	location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
		expires 30d; # 設(shè)置文件在客戶端緩存30天
		add_header Cache-Control "public";
		access_log off; # 可選，關(guān)閉訪問日志以減少日志文件大小
	}
	
	location / {
		proxy_pass http://172.16.11.154:80;  # 內(nèi)部Web服務(wù)器地址
		proxy_http_version 1.1;
		proxy_connect_timeout 360s;          # 若后端啟動慢，可適當(dāng)延長
		proxy_read_timeout 360s;             # 后端響應(yīng)超時時間
		proxy_set_header Host $host;
		proxy_set_header X-Real-IP $remote_addr;  # 傳遞客戶端真實IP
		proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;  # 追加IP到XFF頭部
	}
}

?

根據(jù)您提供完整的配置代碼，現(xiàn)在我看到了問題的關(guān)鍵所在。您的配置確實存在一個邏輯問題。

問題分析

您的配置中存在兩個 location 塊：

1. location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ - 用于處理圖片請求

2. location / - 用于處理所有其他請求并代理到后端服務(wù)器

問題在于：當(dāng)Nginx收到一個圖片請求（如 /images/logo.png）時，它會匹配到第一個 location 塊（圖片處理塊），但在這個塊中，您沒有指定如何處理這些請求 - 沒有 proxy_pass，也沒有 root 指令。因此，Nginx不知道從哪里獲取這些圖片文件，導(dǎo)致請求無法被正確處理。

解決方案

您有兩個選擇來解決這個問題：

方案一：在圖片 location 塊中也添加代理指令（推薦）

這是最簡單直接的解決方案，確保圖片請求也能被代理到后端服務(wù)器。

server {
    listen 80;
    server_name oa22.cn *.oa22.cn;
    
    # 緩存靜態(tài)文件
    location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
        # 添加代理指令
        proxy_pass http://172.16.11.154:80;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        
        # 緩存設(shè)置
        expires 30d;
        add_header Cache-Control "public";
        access_log off;
    }
    
    location / {
        proxy_pass http://172.16.11.154:80;
        proxy_http_version 1.1;
        proxy_connect_timeout 360s;
        proxy_read_timeout 360s;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

方案二：使用 try_files 嘗試代理或提供本地文件

如果您希望Nginx首先嘗試從本地提供靜態(tài)文件（如果存在），否則代理到后端，可以使用這種方法：

server {
    listen 80;
    server_name oa22.cn *.oa22.cn;
    
    # 設(shè)置根目錄（用于本地靜態(tài)文件）
    root /path/to/your/static/files;
    
    # 緩存靜態(tài)文件
    location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
        # 先嘗試提供本地文件，如果沒有則代理到后端
        try_files $uri @proxy;
        
        # 緩存設(shè)置
        expires 30d;
        add_header Cache-Control "public";
        access_log off;
    }
    
    location @proxy {
        proxy_pass http://172.16.11.154:80;
        proxy_http_version 1.1;
        proxy_connect_timeout 360s;
        proxy_read_timeout 360s;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
    
    location / {
        proxy_pass http://172.16.11.154:80;
        proxy_http_version 1.1;
        proxy_connect_timeout 360s;
        proxy_read_timeout 360s;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

推薦使用方案一

對于您的使用場景（純反向代理），方案一更加簡單和直接。您只需要在圖片處理的 location 塊中添加 proxy_pass 和相關(guān)代理頭設(shè)置即可。

修改后的完整配置

server {
    listen 80;
    server_name oa22.cn *.oa22.cn;
    
    # 緩存靜態(tài)文件
    location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
        proxy_pass http://172.16.11.154:80;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        
        expires 30d;
        add_header Cache-Control "public";
        access_log off;
    }
    
    location / {
        proxy_pass http://172.16.11.154:80;
        proxy_http_version 1.1;
        proxy_connect_timeout 360s;
        proxy_read_timeout 360s;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

測試和重載配置

修改后，請執(zhí)行以下命令：

# 測試配置語法
sudo nginx -t


# 重載配置
sudo systemctl reload nginx

現(xiàn)在，圖片請求應(yīng)該能夠正常代理到后端服務(wù)器，并且響應(yīng)頭中會包含緩存指令。