1. 程式人生 > >vue專案釋出,通過nginx跨越問題

vue專案釋出,通過nginx跨越問題

# 自己使用記錄

server {
        listen       80;
        server_name  127.0.0.1;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        root   G:/dist;  //  vue專案build打包地址
		index  index.html index.htm;
		
		location ^~ /test/ { // 匹配到路徑中有test的就停止向下搜尋,採用這一條
			proxy_pass http://127.0.0.1:8081/;  // 後臺專案訪問地址
		}
		
		location / {
			try_files $uri $uri/ @router;
			index index.html;
        }
		
		location @router {
			rewrite ^.*$ /index.html last;
        }
		
        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

    }
location  = / {
  # 精確匹配 / ,主機名後面不能帶任何字串
  [ configuration A ] 
}

location  / {
  # 因為所有的地址都以 / 開頭,所以這條規則將匹配到所有請求
  # 但是正則和最長字串會優先匹配
  [ configuration B ] 
}

location /documents/ {
  # 匹配任何以 /documents/ 開頭的地址,匹配符合以後,還要繼續往下搜尋
  # 只有後面的正則表示式沒有匹配到時,這一條才會採用這一條
  [ configuration C ] 
}

location ~ /documents/Abc {
  # 匹配任何以 /documents/ 開頭的地址,匹配符合以後,還要繼續往下搜尋
  # 只有後面的正則表示式沒有匹配到時,這一條才會採用這一條
  [ configuration CC ] 
}

location ^~ /images/ {
  # 匹配任何以 /images/ 開頭的地址,匹配符合以後,停止往下搜尋正則,採用這一條。
  [ configuration D ] 
}

location ~* \.(gif|jpg|jpeg)$ {
  # 匹配所有以 gif,jpg或jpeg 結尾的請求
  # 然而,所有請求 /images/ 下的圖片會被 config D 處理,因為 ^~ 到達不了這一條正則
  [ configuration E ] 
}

location /images/ {
  # 字元匹配到 /images/,繼續往下,會發現 ^~ 存在
  [ configuration F ] 
}

location /images/abc {
  # 最長字元匹配到 /images/abc,繼續往下,會發現 ^~ 存在
  # F與G的放置順序是沒有關係的
  [ configuration G ] 
}

location ~ /images/abc/ {
  # 只有去掉 config D 才有效:先最長匹配 config G 開頭的地址,繼續往下搜尋,匹配到這一條正則,採用
    [ configuration H ] 
}

location ~* /js/.*/\.js

已=開頭表示精確匹配
如 A 中只匹配根目錄結尾的請求,後面不能帶任何字串。
^~ 開頭表示uri以某個常規字串開頭,不是正則匹配
~ 開頭表示區分大小寫的正則匹配;
~* 開頭表示不區分大小寫的正則匹配
/ 通用匹配, 如果沒有其它匹配,任何請求都會匹配到

具體規則本文是檢視文章: https://segmentfault.com/a/1190000002797606