經過vue-cli3.x版本構建的項目使用proxy和之前的項目不一樣,並且3.x版本構建的時候能夠選用typescript了。下面記錄一下如何使用proxy跨域。
首先在根目錄建立vue.config.js文件,這個配置文件在運行項目的時候自動加載。vue
// vue.config.js module.exports = { devServer: { proxy: { '/api': { target: 'http://xxxx/device/', //對應本身的接口 changeOrigin: true, ws: true, pathRewrite: { '^/api': '' } } } } }
這個文件還能夠配置其它信息,好比修改端口號,默認是8080等等。
最後在頁面發送請求的時候:ios
axios.get('/api/getDataPoint').then(res => { console.log(res) })
雖然咱們在控制檯看到請求的地址仍是本來的路徑,可是已經代理請求到http://xxxx/device/getDataPoint,這樣就能夠解決跨域的問題了。vue-cli