013.Nginx動靜分離

来源:https://www.cnblogs.com/itzgr/archive/2020/07/18/13335271.html
-Advertisement-
Play Games

一 動靜分離概述 1.1 動靜分離介紹 為了提高網站的響應速度，減輕程式伺服器（Tomcat，Jboss等）的負載，對於靜態資源，如圖片、js、css等文件，可以在反向代理伺服器中進行緩存，這樣瀏覽器在請求一個靜態資源時，代理伺服器就可以直接處理，而不用將請求轉發給後端伺服器。對於用戶請求的動態文件 ...


一 動靜分離概述

1.1 動靜分離介紹

為了提高網站的響應速度，減輕程式伺服器（Tomcat，Jboss等）的負載，對於靜態資源，如圖片、js、css等文件，可以在反向代理伺服器中進行緩存，這樣瀏覽器在請求一個靜態資源時，代理伺服器就可以直接處理，而不用將請求轉發給後端伺服器。對於用戶請求的動態文件，如servlet、jsp，則轉發給Tomcat，Jboss伺服器處理，這就是動靜分離。即動態文件與靜態文件的分離。

1.2 動靜分離原理

動靜分離可通過location對請求url進行匹配，將網站靜態資源（HTML，JavaScript，CSS，img等文件）與後臺應用分開部署，提高用戶訪問靜態代碼的速度，降低對後臺應用訪問。通常將靜態資源放到nginx中，動態資源轉發到tomcat伺服器中。 clipboard

二 動靜分離實現--根據文件尾碼

2.1 環境準備

主機

IP

角色

備註

nginx01

172.24.10.21

Nginx Proxy主機

接受請求，並代理至後端css存儲點

nginx02

172.24.10.22

Nginx 靜態伺服器

處理靜態請求

nginx03

172.24.10.23

Nginx 動態伺服器

處理動態請求
本實驗動靜分離主要是通過nginx+tomcat來實現，其中nginx01進行前端代理，同時本地處理css靜態文件，nginx02處理圖片、html、JS等靜態文件，tomcat處理jsp、servlet等動態請求。

2.2 創建靜態站點

  1 [root@nginx02 ~]# mkdir /usr/share/nginx/staticrs/
  2 [root@nginx02 ~]# echo '<h1>Static_Web</h1>' > /usr/share/nginx/staticrs/index.html
  3 [root@nginx02 ~]# ll /usr/share/nginx/staticrs/		#上傳示例圖片靜態資源
  4 total 16K
  5 -rw-r--r-- 1 root root  20 Jun 20 14:32 index.html
  6 -rw-r--r-- 1 root root 11K Jun 20 14:35 nginx.jpg
  7 [root@nginx02 ~]# mv /etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf.bak
  
  1 [root@nginx02 ~]# vi /etc/nginx/conf.d/staticrs.conf
  2 server {
  3     listen  80;
  4     server_name  staticrs.linuxds.com;
  5     access_log  /var/log/nginx/staticrs.access.log  main;
  6     error_log   /var/log/nginx/staticrs.error.log  warn;
  7     location / {
  8         root   /usr/share/nginx/staticrs;
  9         index  index.html;
 10     }
 11 }
  
  1 [root@nginx02 ~]# nginx -t -c /etc/nginx/nginx.conf	#檢查配置文件
  2 [root@nginx02 ~]# nginx -s reload			#重載配置文件
  手動訪問後端靜態站點及資源：http://staticrs.linuxds.com/及http://staticrs.linuxds.com/nginx.jpg。 clipboard clipboard

2.3 創建動態站點

  1 [root@nginx03 ~]# yum install -y tomcat
  2 [root@nginx03 ~]# mkdir -p /usr/share/tomcat/webapps/ROOT
  
  1 [root@nginx03 ~]# vi /usr/share/tomcat/webapps/ROOT/javatest.jsp	#構建動態測試頁面
  2 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
  3 <HTML>
  4   <HEAD>
  5     <TITLE>JSP Test Page</TITLE>
  6   </HEAD>
  7 
  8   <BODY>
  9     <%
 10       Random rand = new Random();
 11       out.println("<h1>隨機數:<h1>");
 12       out.println(rand.nextInt(99)+100);
 13     %>
 14   </BODY>
 15 </HTML>
  
  1 [root@nginx03 ~]# systemctl start tomcat.service	#啟動tomcat
手動訪問後端動態站點及資源：http://dynamic.linuxds.com:8080/javatest.jsp clipboard

2.4 配置前端動靜分離

  1 [root@nginx01 ~]# mkdir -p /usr/share/nginx/dss
  2 [root@nginx01 ~]# ll /usr/share/nginx/dss/
  3 total 4.0K
  4 -rw-r--r-- 1 root root 1.9K Jun 20 18:10 test.css	#模擬css
  
  1 [root@nginx01 ~]# vi /etc/nginx/conf.d/dss.conf		#配置Dynamic-Static Separation
  2 upstream static_server {
  3     server 172.24.10.22;
  4 }
  5 upstream tomcat_server {
  6     server 172.24.10.23:8080;
  7 }
  8 
  9 server {
 10     listen       80;
 11     server_name  dss.linuxds.com;
 12     access_log  /var/log/nginx/dss.access.log  main;
 13     error_log   /var/log/nginx/dss.error.log  warn;
 14     proxy_set_header    X-Real-IP       $remote_addr;
 15     proxy_set_header    Host            $host;
 16     proxy_set_header    X-Forwarded-For         $proxy_add_x_forwarded_for;
 17     proxy_set_header    X-Forwarded-Proto       $scheme;
 18 #    location / {
 19 #        root html;
 20 #        index index.html;
 21 #    }
 22     location / {
 23         proxy_pass http://static_server;
 24     }
 25     location ~  .*\.(css)$  {
 26         root   /usr/share/nginx/dss;
 27     }
 28     location ~ .*\.(htm|html|gif|jpg|jpeg|png|gif|bmp|swf|ioc|rar|zip|txt|flv|mid|doc|ppt|pdf|xls|mp3|wma) {
 29         proxy_pass http://static_server;
 30         expires 5d;
 31     }
 32     location ~ .*\.jsp$ {
 33         proxy_pass http://tomcat_server;
 34         expires 1h;
 35     }
 36     error_page   500 502 503 504  /50x.html;
 37     location = /50x.html {
 38         root   html;
 39     }
 40 }
  
  1 [root@nginx01 ~]# nginx -t -c /etc/nginx/nginx.conf	#檢查配置文件
  2 [root@nginx01 ~]# nginx -s reload			#重載配置文件
 

2.5 訪問測試

瀏覽器分別訪問：http://dss.linuxds.com/，http://dss.linuxds.com/javatest.jsp，http://staticrs.linuxds.com/nginx.jpg，http://dss.linuxds.com/test.css。 clipboard

三 動靜分離實現--根據文件路徑

3.1 環境準備

參考2.1.

3.2 創建靜態站點

  1 [root@nginx02 ~]# mkdir /usr/share/nginx/staticrs/
  2 [root@nginx02 ~]# echo '<h1>Static_Web</h1>' > /usr/share/nginx/staticrs/index.html
  3 [root@nginx02 ~]# ll /usr/share/nginx/staticrs/		#上傳示例圖片靜態資源
  4 total 16K
  5 -rw-r--r-- 1 root root  20 Jun 20 14:32 index.html
  6 -rw-r--r-- 1 root root 11K Jun 20 14:35 nginx.jpg
  7 [root@nginx02 ~]# mv /etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf.bak
  
  1 [root@nginx02 ~]# vi /etc/nginx/conf.d/staticrs.conf
  2 server {
  3     listen  80;
  4     server_name  staticrs.linuxds.com;
  5     access_log  /var/log/nginx/staticrs.access.log  main;
  6     error_log   /var/log/nginx/staticrs.error.log  warn;
  7     location /static {
  8         alias   /usr/share/nginx/staticrs;
  9         index  index.html;
 10     }
 11 }
  
  1 [root@nginx02 ~]# nginx -t -c /etc/nginx/nginx.conf	#檢查配置文件
  2 [root@nginx02 ~]# nginx -s reload			#重載配置文件
  手動訪問後端靜態站點及資源：http://staticrs.linuxds.com/static/及http://staticrs.linuxds.com/static/nginx.jpg。

3.3 創建動態站點

  1 [root@nginx03 ~]# yum install -y tomcat
  2 [root@nginx03 ~]# mkdir -p /usr/share/tomcat/webapps/ROOT/dynamic
  
  1 [root@nginx03 ~]# vi /usr/share/tomcat/webapps/ROOT/dynamic/javatest.jsp
  2 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
  3 <HTML>
  4   <HEAD>
  5     <TITLE>JSP Test Page</TITLE>
  6   </HEAD>
  7 
  8   <BODY>
  9     <%
 10       Random rand = new Random();
 11       out.println("<h1>隨機數:<h1>");
 12       out.println(rand.nextInt(99)+100);
 13     %>
 14   </BODY>
 15 </HTML>
  
  1 [root@nginx03 ~]# systemctl start tomcat.service	#啟動tomcat
手動訪問後端動態站點及資源：http://dynamic.linuxds.com:8080/dynamic/javatest.jsp

3.4 配置前端動靜分離

  1 [root@nginx01 ~]# mkdir -p /usr/share/nginx/dss
  2 [root@nginx01 ~]# ll /usr/share/nginx/dss/
  3 total 4.0K
  
  1 [root@nginx01 ~]# vi /etc/nginx/conf.d/dss.conf		#配置Dynamic-Static Separation
  2 upstream static_server {
  3     server 172.24.10.22;
  4 }
  5 upstream tomcat_server {
  6     server 172.24.10.23:8080;
  7 }
  8 
  9 server {
 10     listen       80;
 11     server_name  dss.linuxds.com;
 12     access_log  /var/log/nginx/dss.access.log  main;
 13     error_log   /var/log/nginx/dss.error.log  warn;
 14     proxy_set_header    X-Real-IP       $remote_addr;
 15     proxy_set_header    Host            $host;
 16     proxy_set_header    X-Forwarded-For         $proxy_add_x_forwarded_for;
 17     proxy_set_header    X-Forwarded-Proto       $scheme;
 18 #    location / {
 19 #        root html;
 20 #        index index.html;
 21 #    }
 22     location / {
 23         proxy_pass http://static_server;
 24     }
 25     location ~  .*\.(css)$  {
 26         root   /usr/share/nginx/dss;
 27     }
 28     location /static/ {
 29         proxy_pass http://static_server;
 30         expires 5d;
 31     }
 32     location /dynamic/ {
 33         proxy_pass http://tomcat_server;
 34         expires 1h;
 35     }
 36     error_page   500 502 503 504  /50x.html;
 37     location = /50x.html {
 38         root   html;
 39     }
 40 }
  
  1 [root@nginx01 ~]# nginx -t -c /etc/nginx/nginx.conf	#檢查配置文件
  2 [root@nginx01 ~]# nginx -s reload			#重載配置文件
 

3.5 訪問測試

瀏覽器分別訪問：http://dss.linuxds.com/，http://dss.linuxds.com/dynamic/javatest.jsp，http://staticrs.linuxds.com/static/nginx.jpg，http://dss.linuxds.com/test.css。 clipboard 參考：https://klionsec.github.io/2017/12/21/nginx-static-dynamic/。
您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 授權許可權服務設計解析
    設計思想 接上篇設計一個授權服務 來聊聊 他是怎麼被設計出來的 https://www.cnblogs.com/alangur/p/13187053.html#4628838 設計說明 許可權服務作為微服務中其實也可以認為只一個授權中心。在這個授權中心下，他主要提供其他服務的需要的用戶的業務邏輯的驗證 ...
  • 筆試線上考試系統-管理員登錄、考生管理
    1、管理員登錄 頁面效果 實現步驟： public ActionResult AdminLogin(AdminLoginModel model) { if (FormsAuthentication.Authenticate(model.UserName, model.Password)) { For ...
  • 筆試考試系統-創建資料庫和表
    --切換資料庫use mastergo --判斷資料庫是否存在，如果存在則刪除if exists(select * from sys.databases where name='OnlineExamDB')drop database OnlineExamDBgo --創建OnlineExamDB數據 ...
  • USB技術淺析
    《帶你遨游USB世界》中，我們已經初步介紹了USB的整體架構，本文將從以下幾個方面繼續介紹USB的內容。 USB3.0有什麼新特性？ TYPEC介紹 otg識別流程 一、USB3.0 USB是史上定義出的最成功的PC外圍互連技術，並且已經迅猛地被引入到CE和Mobile領域。僅僅在2006年，就有超 ...
  • Shell：輸出幫助
    日常執行腳本的時候，時間久了不知道腳本的作用和實行了哪些功能，需要重新看腳本源碼。因此，需要對腳本做一下輸出幫助。 ...
  • modprobe 載入模塊時 出現許可權不允許提醒；Operation not permitted
    最近在編譯安裝第三方內核模塊時，可能是因為沒有正確簽名的原因；一直安裝不了；出現Operation not permitted錯誤； 錯誤類似於這種情況：sudo 許可權也已經開了； modprobe: ERROR: could not insert 'wireguard': Operation no ...
  • 你不會還不知道按位取反運算的原理吧
    引入 首先來看一個程式,分別列印4和-4的取反運算結果,代碼: public static void main(String[] args) { System.out.println(~4); System.out.println(~(-4));} 不妨思考一下結果,如果結果是-4和4的話,那請繼續 ...
  • 帶你遨游USB世界
    1、什麼是USB USB的全稱是Universal Serial Bus,通用串列匯流排。它的出現主要是為了簡化個人電腦與外圍設備的連接，增加易用性。USB支持熱插拔，並且是即插即用的，另外，它還具有很強的可擴展性，傳輸速度也很快，這些特性使支持USB介面的電子設備更易用、更大眾化。 本文將從USB ...
一周排行
    -Advertisement-
    Play Games
  • .NET 6 Entity Framework Core Db First（1） 創建模型
    .Net8.0 Blazor Hybird 桌面端 (WPF/Winform) 實測可以完整運行在 win7sp1/win10/win11. 如果用其他工具打包,還可以運行在mac/linux下, 傳送門BlazorHybrid 發佈為無依賴包方式 安裝 WebView2Runtime 1.57 M ...
  • 資料庫升級PostgreSql+Garnet
    目錄前言PostgreSql安裝測試額外Nuget安裝Person.cs模擬運行Navicate連postgresql解決方案Garnet為什麼要選擇Garnet而不是RedisRedis不再開源Windows版的Redis是由微軟維護的Windows Redis版本老舊，後續可能不再更新Garne ...
  • 如何基於surging架設流媒體視頻推流（視頻講解）
    C#TMS系統代碼-聯表報表學習 領導被裁了之後很快就有人上任了，幾乎是無縫銜接，很難讓我不想到這早就決定好了。我的職責沒有任何變化。感受下來這個系統封裝程度很高，我只要會調用方法就行。這個系統交付之後不會有太多問題，更多應該是做小需求，有大的開發任務應該也是第二期的事，嗯？怎麼感覺我變成運維了？而 ...
  • EAV模型（實體-屬性-值）的設計和低代碼的處理方案（2）--數據的查詢處理
    我在隨筆《EAV模型（實體-屬性-值）的設計和低代碼的處理方案（1）》中介紹了一些基本的EAV模型設計知識和基於Winform場景下低代碼（或者說無代碼）的一些實現思路，在本篇隨筆中，我們來分析一下這種針對通用業務，且只需定義就能構建業務模塊存儲和界面的解決方案，其中的數據查詢處理的操作。 ...
  • C# 程式集、模塊和類型概念及關係
    對某個遠程伺服器啟用和設置NTP服務(Windows系統) 打開註冊表 HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\W32Time\TimeProviders\NtpServer 將 Enabled 的值設置為 1，這將啟用NTP伺服器功 ...
  • Django信號與擴展：深入理解與實踐
    title: Django信號與擴展：深入理解與實踐 date: 2024/5/15 22:40:52 updated: 2024/5/15 22:40:52 categories: 後端開發 tags: Django 信號 松耦合 觀察者 擴展 安全 性能 第一部分：Django信號基礎 Djan ...
  • Django3.2安裝源碼xadmin2步驟以及遇到的問題
    使用xadmin2遇到的問題&解決 環境配置： 使用的模塊版本： 關聯的包 Django 3.2.15 mysqlclient 2.2.4 xadmin 2.0.1 django-crispy-forms >= 1.6.0 django-import-export >= 0.5.1 django-r ...
  • 原創->CommonsCollections1-DefaultMap鏈
    今天我打算整點兒不一樣的內容，通過之前學習的TransformerMap和LazyMap鏈，想搞點不一樣的，所以我關註了另外一條鏈DefaultedMap鏈，主要調用鏈為： 調用鏈詳細描述： ObjectInputStream.readObject() DefaultedMap.readObject ...
  • 05-應用級開發者 AI 時代破局點
    後端應用級開發者該如何擁抱 AI GC？就是在這樣的一個大的浪潮下，我們的傳統的應用級開發者。我們該如何選擇職業或者是如何去快速轉型，跟上這樣的一個行業的一個浪潮? 0 AI金字塔模型 越往上它的整個難度就是職業機會也好，或者說是整個的這個運作也好,它的難度會越大,然後越往下機會就會越多,所以這是一 ...
  • Java面試題：讓依賴註入變得簡單，面對@Autowired和@Resource，該如何選擇？
    @Autowired是Spring框架提供的註解，@Resource是Java EE 5規範提供的註解。 @Autowired預設按照類型自動裝配，而@Resource預設按照名稱自動裝配。 @Autowired支持@Qualifier註解來指定裝配哪一個具有相同類型的bean，而@Resourc... ...
所有分類