關於nginx部署vue項目的兩個問題


首先我使用的是后端接口+前端vue的形式,這樣就涉及到跨域的問題。我是這樣配置的:

server {
        listen       80;
        server_name  www.liangyp.xyz;//訪問網址

        location / {
                root  /var/www/VueApp;
                index  index.html index.htm;
        }
                //這里是配置的如果訪問apis則是轉到后端接口,這樣就避免了跨域
                location /apis {
                        rewrite  ^/apis/(.*)$ /$1 break;
                        proxy_pass   http://127.0.0.1:3000/;
       }
}

然后還遇到一個問題:我在vue中使用的是vue-router跳轉的,如果跳到二級菜單,刷新頁面的話會出現404頁面。這是因為在vue中使用的是js渲染的虛擬目錄,而在nginx配置中並沒有實際的資源,所有會出現404。直接上配置:

server {
        listen       80;
        server_name  www.liangyp.xyz;

        location / {
                root  /var/www/VueApp;
                index  index.html index.htm;
                try_files $uri $uri/ @router;
        }
        location @router {
            rewrite ^.*$ /index.html last;
        }

                location /apis {
                        rewrite  ^/apis/(.*)$ /$1 break;
                        proxy_pass   http://127.0.0.1:3000/;
       }
}

加上這些后就可以正常訪問啦。


免責聲明!

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



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