vueRouter history模式下 nginx配置


對於VUE的router[mode: history]模式(這里主要是為了去除鏈接上的"#")
開發的時候,一般都不出問題。是因為開發時用的服務器為node,Dev環境中已配置好了,

nginx運行的時首頁沒有問題,鏈接也沒有問題,但在點擊刷新后,頁面就會顯示(404)

原配置:

 location / {
        root  /home/testhadoop/www/html;
        index index.html index.htm;
    }

解決方案如下:

方案一:
使用try_files

語法:try_files file1 [file2 ... filen] fallback

location / {
    root  /home/testhadoop/www/html;
    index index.html index.htm;
    try_files $uri $uri/ /index.html;
}

方案二:
使用try_files

location /{

    root  /home/testhadoop/www/html;
    index  index.html index.htm;

    if (!-e $request_filename) {
        rewrite ^/(.*) /index.html last;
        break;
    }
}

方案三:
使用error_page (一般不建議用, 404的方式會被第三方劫持)

location /{

    root  /home/testhadoop/www/html;
    index  index.html index.htm;

    error_page 404 /index.html;
}


  

原文:https://www.jianshu.com/p/f7a19f1bafa0


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM