1. 程式人生 > >vue-cli開發環境實現跨域請求

vue-cli開發環境實現跨域請求

前端開發時,請求後臺介面經常需要跨域,vue-cli實現跨域請求只需要開啟config/index.js,修改如下內容即可。

//例如要請求的介面url為http://172.3.2.1:8000/look/1

module.exports = {
    dev:{
        proxyTable:{
            '/api':{
                target: 'http://172.3.2.1:8000',
                changeOrigin: true,
                pathRewrite: {
                  '^/api'
: '' } } } } }

這時在你想請求介面的url處,輸入/api/look/1 即可實現跨域請求。

這時如果開啟F12會發現請求的url是localhost:8080/api/look/1,這其實是虛擬從本地請求資料,這樣就不會有跨域的問題產生了。

一般情況下上面的方法是沒有問題的,要是上面的方法行不通,可以試試這樣寫:

//例如要請求的介面url為http://172.3.2.1:8000/look/1

module.exports = {
    dev:{
        proxyTable:{
            '/look'
:{ target: 'http://172.3.2.1:8000', changeOrigin: true, pathRewrite: { '^/look': '/look' } } } } }

這時在你想請求介面的url處,輸入/look/1 即可實現跨域請求。