欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Nginx多個前端服務(wù)配置方式詳解

 更新時間:2022年03月23日 14:51:06   作者:哈啊哈鉿  
這篇文章主要介紹了Nginx多個前端服務(wù)配置方式,主要包括多個location配置,多個server配置,配置方式本文給大家介紹的非常詳細,感興趣的朋友一起看看吧

需求

有多個前端服務(wù)需要通過Nginx部署。

Nginx多個前端服務(wù)配置方式

可以通過多個server配置或者多個location配置來配置多個前端服務(wù)。

多個location配置

location中root和alias的區(qū)別:location后面的路徑是真實路徑用root,虛擬路徑用alias
真實路徑就是本地訪問地址里面有的路徑
例如vue前端服務(wù)設(shè)置了publicPath='/allow-cost-calc',
前端訪問路徑為:http://localhost:8005/allow-cost-calc/#/login,/allow-cost-calc就是真實路徑,則使用 location /allow-cost-calc配置時里面使用root 來指定前端服務(wù)路徑(如下服務(wù)3配置)。

若前端訪問路徑為:http://localhost:8005/#/login,如果此時我們使用root來配置,那么location后面的路徑只能使用真實路徑,只能使用 /,但是多個服務(wù)配置時/有可能已被使用(例如下面被服務(wù)1配置了),所以需要使用虛擬路徑來配置,如下服務(wù)2配置:使用/s2 來作為虛擬路徑,使用alias來指定服務(wù)位置,部署后的訪問方式要帶上虛擬路徑http://localhost:8005/s2/#/login

http {
    #嵌入其他配置文件 語法:include /path/file
	#參數(shù)既可以是絕對路徑也可以是相對路徑(相對于Nginx的配置目錄,即nginx.conf所在的目錄)
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;
    keepalive_timeout  65;
	#限制上傳文件大小
	client_max_body_size       20m;
    server { 
		client_max_body_size  100M;
        listen 1004;
        server_name  localhost, 127.0.0.1;
		#服務(wù)1
		location / {
		  root dist;
		  index index.html;
		}
		#服務(wù)2:由于/r2 是虛擬路徑,所以用alias,會為訪問dist3下面的首頁
		location /r2 {
		  alias  dist3;
		#服務(wù)3:由于/allow-cost-calc 是真實路徑,所以用root,會訪問/allow-cost-calc/dist2下面的首頁   
		#(vue打包時設(shè)置了publicPath = '/allow-cost-calc',同時打包后的文件也必須放到allow-cost-calc文件夾下 dists2/allow-cost-calc/前端包文件)
		location /allow-cost-calc {
		  root  dist2;
		
		#后端代理,后端代理不受前端路徑的影響
        location /api/ {
            proxy_pass http://10.51.105.7:31500/;
            proxy_pass_request_headers on;
            proxy_set_header Host $host;
            proxy_set_header X-Client-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
    }
}

多個server配置

每個前端服務(wù)獨自使用一個server服務(wù)。nginx.conf部分配置如下:

http {
   #前端服務(wù)1
   server {
        root dist1;#前端包位置
        client_max_body_size 100M;
        listen 7001;
        server_name localhost, 127.0.0.1;
        location /api/ {
        	proxy_pass http://10.51.105.7:31500/;
            proxy_pass_request_headers on;
            proxy_set_header Host $host;
            proxy_set_header X-Client-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
   }
   #前端服務(wù)2
        root dist2;#前端包位置
        listen 7002;
}

到此這篇關(guān)于Nginx多個前端服務(wù)配置的文章就介紹到這了,更多相關(guān)Nginx配置多個前端內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • win10系統(tǒng)安裝Nginx的詳細步驟

    win10系統(tǒng)安裝Nginx的詳細步驟

    Nginx是一款自由的、開源的、高性能的HTTP服務(wù)器和反向代理服務(wù)器,同時也提供了IMAP/POP3/SMTP服務(wù),這篇文章主要介紹了win10系統(tǒng)安裝Nginx的詳細步驟,需要的朋友可以參考下
    2023-02-02
  • Nginx訪問靜態(tài)資源配置的實現(xiàn)步驟

    Nginx訪問靜態(tài)資源配置的實現(xiàn)步驟

    Nginx 擅長于底層服務(wù)器端資源的處理,例如靜態(tài)資源處理轉(zhuǎn)發(fā)、反向代理,負載均衡等,本文主要介紹了Nginx訪問靜態(tài)資源配置的實現(xiàn)步驟,具有一定的參考價值,感興趣的可以了解一下
    2023-09-09
  • ubuntu上配置Nginx+PHP5 FastCGI服務(wù)器配置

    ubuntu上配置Nginx+PHP5 FastCGI服務(wù)器配置

    ubuntu上配置Nginx+PHP5 FastCGI服務(wù)器配置方法, 需要的朋友可以參考下。
    2010-06-06
  • nginx?host繞過的三種方式

    nginx?host繞過的三種方式

    本文主要介紹了nginx?host繞過的三種方式,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2023-03-03
  • 淺談Nginx 中的兩種限流方式

    淺談Nginx 中的兩種限流方式

    這篇文章主要介紹了淺談Nginx 中的兩種限流方式,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2020-11-11
  • 解決Nginx無法啟動 -10013: An attempt was made to access a socket in a way forbidden by its access permission的問題

    解決Nginx無法啟動 -10013: An attempt was 

    這篇文章主要給大家介紹了解決用nginx -t 發(fā)成Nginx無法啟動報錯10013: An attempt was made to access a socket in a way forbidden by its access permissions的問題,需要的朋友可以參考下
    2023-11-11
  • nginx配置將HTTPS請求轉(zhuǎn)換成HTTP的方法實現(xiàn)

    nginx配置將HTTPS請求轉(zhuǎn)換成HTTP的方法實現(xiàn)

    Nginx是一個很流行、很強大的代理軟件,我們可以借助Nginx,設(shè)置 http強轉(zhuǎn)https,本文就來詳細的介紹一下,感興趣的可以了解一下
    2023-09-09
  • HTTP 499 狀態(tài)碼 nginx下 499錯誤的解決辦法

    HTTP 499 狀態(tài)碼 nginx下 499錯誤的解決辦法

    HTTP狀態(tài)碼出現(xiàn)499錯誤有多種情況,499錯誤是什么?Nginx 499錯誤的原因及解決方法,下面跟著腳本之家小編一起學(xué)習(xí)吧
    2016-06-06
  • Nginx搭建https服務(wù)器教程

    Nginx搭建https服務(wù)器教程

    這篇文章主要為大家詳細介紹了Nginx搭建https服務(wù)器教程,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-04-04
  • nginx下配置thinkphp文件的方法

    nginx下配置thinkphp文件的方法

    這篇文章主要介紹了nginx下配置thinkphp文件的方法,需要的朋友可以參考下
    2017-01-01

最新評論