當前位置:成語大全網 - 書法字典 - 如何在vue中優雅地解決跨域(路由沖突)

如何在vue中優雅地解決跨域(路由沖突)

如何優雅地解決vue中的跨域和路由沖突問題

當我們在路由中配置以下代理時,我們可以解決跨域問題。

代理表:{

/goods/*:{

目標:“/API/”:“API/”

}

然後引入main.js,可以保證生產和開發的定義前綴可以動態匹配。

從'導入apiConfig../config/api.config '

從“axios”導入Axios

從“vue-axios”導入VueAxios

Vue.use(VueAxios,Axios)

axios . defaults . base URL = API config . base URL

經過上述配置後,可以在dom中輕松訪問,不需要在任何組件中引入axios模塊。

註銷(){

這個。$/api/' : 'api/'

}

不太懂生產開發配置。

可以去dev-server.js看看配置代碼。

const webpackConfig =(process . ENV . node _ ENV = = = ' testing ' | | process . ENV . node _ ENV = = = ' production ')?

要求('。/webpack.prod.conf '):

要求('。/webpack.dev.conf ')

在main.js條目文件中配置。

從'導入apiConfig../config/api.config '

從“axios”導入Axios

從“vue-axios”導入VueAxios

Vue.use(VueAxios,Axios)

axios . defaults . base URL = API config . base URL

在dom中請求api的手勢。

註銷(){

這個。$http.post('/users/logout ')。然後(result = & gt{

設res = result.data

this . nickname =“”;

console . log(RES);

})

},

getGoods(){

這個。$http.post('/goods/list ')。然後(result = & gt{

設res = result.data

this . nickname =“”;

console . log(RES);

})

}

關於vuejs項目的生產環境,請看下面這篇在線解決跨域問題的文章。

看看這篇關於vue項目啟動的文章,是專門為啟動而寫的。