先上圖展示下自己vue里面針對跨域設置的代理截圖,記住紅框里面的代碼,待會要用。一般設置代理都是為了防止在測試調用接口的時候出現跨域的情況,但是設置代理后直接npm run start並沒有問題,訪問接口也正常,但是當打包執行npm run build 之后,console控制台會出現下圖404的情況
如果build后的dist文件是放在nginx上的,可用以下方式解決 ,記得上圖紅框里面的代碼嗎,把對應的接口地址和反向代理的名稱在nginx的nginx.conf文件里補充一下就可以,解決404的問題
代碼:
server {
listen 8082;
server_name localhost;
location / {
root D:/GXT/gxtWebsite/dist;
index index.html index.htm;
}
location /getNews {
proxy_pass http://172.16.27.67:8080/enterprise/selectAll;
}
location /getProducts {
proxy_pass http://172.16.27.67:8080/enterprise/selectProductSolution;
}
}
圖:
另:千萬不要在
location /getNews {
proxy_pass http://172.16.27.67:8080
}
里面直接寫域名,至少后面跟一個方法 /selectAll,雖然我不知道為什么,但是直接域名的話好像不行,還是會404
location /getNews {
proxy_pass http://172.16.27.67:8080/enterprise/selectAll;
}