nginx 配置 vue History模式

牛奔發表於2024-05-28
NginxVue模式

解決

需要加一行 try_files $uri $uri/ /index.html;，其中 /index.html 是你自己的目錄中的入口檔案

server {
        listen [::]:80 default_server;

        #root /var/www/html;

        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        server_name _;

        location / {
                # First attempt to serve request as file, then
                root /root/test/dist;
                # as directory, then fall back to displaying a 404.
                #try_files $uri $uri/ =404;
                try_files $uri $uri/ /index.html;
        }
……
}

try_files file... uri

這個語法的意思是：

  • try_files 後面可以定義多個檔案路徑和最後一個作為內部跳轉的 uri，其中檔案路徑是和 alias 和 root 兩個指令合在一起構造而成；
  • 多個檔案以第一個找到的檔案作為請求；
  • 而檔案後面以"/"結尾，會檢查目錄是否存在；
  • 當檔案都找不到時，就會去以最後一個uri進行內部跳轉請求。

相關文章