進一步配置Nginx支持HTML5 history state,React browser router

Nginx支持支持HTML5 history state,基本的配置方法如下

		location / {
		        try_files $uri /index.html;
		}

你很快就會發現這種配置方式的缺點:只要/index.html存在,服務端就不會響應404,即使客戶端請求了實際不存在的JS/CSS/圖片等資源。

上述缺點導致的問題可能會讓人抓狂:頁面出不來預期效果,網絡加載看上去沒錯誤,最後才發現原來資源引用路徑有點偏差,害得人調試大半天。

解決方法也簡單:若請求的資源找不到,而客戶端又不想要後備的HTML,該響應404還是得該響應404。

        location / {
                root /var/www/mysite;
                index index.html;

                set $fallback_file /index.html;
                if ($http_accept !~ text/html) {
                        set $fallback_file /null;
                }
                try_files $uri $fallback_file;
        }
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章