vue 打包后訪問接口報錯404 解決方案 (前提是在vue里使用了代理)


先上圖展示下自己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;
  }

 

 

 


免責聲明!

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



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