HTML5模式中的NGINX，proxy_pass和SPA路由

Question

我將NGINX設置爲一個將Docker容器作爲容器運行的虛擬網絡的反向代理。其中一個容器爲基於Angular 4的SPA提供HTML5模式下的客戶端路由。

該應用程序被映射到NGINX上的位置，以便http://server/帶您進入SPA主屏幕。水療中心內航行時

server { 
    listen 80; 

    ... 

    location/{ 
     proxy_pass http://spa-server/; 
    } 

    location /other/ { 
     proxy_pass http://other/; 
    } 

    ... 
} 

的角度路由器改變URL來http://server/home或其它途徑。

但是，當我嘗試直接訪問這些URL時，會返回404。該錯誤源於spa-server，因爲它顯然沒有任何這些路由的內容。

我發現配置NGINX以支持這種情況的例子總是假設SPA的靜態內容直接從NGINX提供，因此try_files是一個可行的選擇。

如何將任何未知的URL轉發到SPA以便它可以處理它們本身？

Answer 1

這對我的作品是將指令proxy_intercept_errors和error_page添加到location /在NGINX解決辦法：

server { 
    listen 80; 

    ... 

    location/{ 
     proxy_pass http://spa-server/; 
     proxy_intercept_errors on; 
     error_page 404 /index.html; 
    } 

    location /other/ { 
     proxy_pass http://other/; 
    } 

    ... 
} 

現在，NGINX將從spa-server返回/index.html即SPA每當一個未知請求URL。不過，該URL可供Angular使用，路由器將立即在SPA內解決該問題。

當然，SPA現在負責處理「真實」404s。幸運的是，無論如何，這在SPA中並不是一個問題和好的做法。