解決vue-element-admin中配置跨域出現(xiàn)的問題
更新時間：2024年07月24日 15:30:26 作者：曦和百里
這篇文章主要介紹了解決vue-element-admin中配置跨域出現(xiàn)的問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
vue-element-admin配置跨域問題
首先來看一下項目結構目錄
我們可以看到.env.development和.env.production文件以及vue.config.js
這里是涉及到了接口的轉發(fā)（我們可以看到base，base的意思是所有的請求前綴都會加上它）
重點來了（如何配置跨域）
proxy: {
[process.env.VUE_APP_BASE_API]: {
target: 'http://127.0.0.1:3000/',
ws: true,
changeOrigin: true,
pathRewrite: { ['^' + process.env.VUE_APP_BASE_API]: '' }
}
}
target：是我要跨域的地址。changeOrigin：開啟跨域pathRewrite：匹配到所有含有當前環(huán)境所對應的前綴的接口進行轉發(fā)
坑來了（這真的是留了好大一個坑，之前查了好久，后來無意間解決了）
在.env.development和.env.production文件中
如果你的#base api和VUE_APP_BASE_API=api
這兩個地方不對應的話，那么你就不能夠實現(xiàn)我所截圖的跨域配置，我之前的配置的都是手動去改，這個坑解決了之后何其優(yōu)雅，只需要更改當前是開發(fā)還是生產(chǎn)環(huán)境就好了
- 更改：
lintOnSave: process.env.NODE_ENV === 'development'
- 或者：
lintOnSave: process.env.NODE_ENV === 'production'
這處就能夠去自動匹配了，之前都是要改好幾個地方，這樣子顯得比較優(yōu)雅。
原因是沒有檢索到這個前綴
總結
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
一個vue組件庫發(fā)布到npm的完整實現(xiàn)過程
工作的時候總是使用別人的npm包,然而我有時心底會好奇自己如何發(fā)布一個npm包呢,什么時候自己的包能夠被很多人喜歡并使用呢,下面這篇文章主要給大家介紹了關于一個vue組件庫發(fā)布到npm的相關資料,需要的朋友可以參考下2022-03-03
這篇文章給大家詳細介紹了Vue強制組件重新渲染的正確方法,非常的實用,有需要的小伙伴可以參考下2020-02-02
本篇文章主要介紹了Vue.js中兄弟組件之間互相傳值實例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
這篇文章主要為大家介紹了input組合事件如何監(jiān)聽輸入中文示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-06-06
typescript不僅可以約束我們的編碼習慣，還能起到注釋的作用，當我們看到一函數(shù)后我們立馬就能知道這個函數(shù)的用法。這篇文章主要介紹了在Vue組件中使用 TypeScript的方法,需要的朋友可以參考下2018-02-02
el-table樹形數(shù)據(jù)量過大,導致頁面卡頓問題及解決
這篇文章主要介紹了el-table樹形數(shù)據(jù)量過大,導致頁面卡頓問題及解決,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-04-04
vue引入jquery時報錯 $ is not defined的問題及解決
這篇文章主要介紹了vue引入jquery時報錯 $ is not defined的問題及解決，具有很好的參考價值，希望對大家有所幫助。2022-09-09
vue3+elementPlus二次封裝表單的實現(xiàn)代碼
最近使用Vue3+ElementPlus開發(fā)項目，從整體上構思組件的封裝。能寫成組件的內容都進行封裝，方便多個地方使用，這篇文章給大家介紹了vue3+elementPlus二次封裝表單的實現(xiàn)，并通過代碼介紹的非常詳細,需要的朋友可以參考下2024-03-03
這篇文章主要介紹了vuejs-手把手教你寫一個完整的購物車實例代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-07-07
在項目里有個打印功能,將頁面的部分內容打印出來,所以下面這篇文章主要給大家介紹了關于利用vue實現(xiàn)打印頁面的幾種方法,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-11-11