對于前端開發(fā)人員來講，當(dāng)你在開發(fā)環(huán)境中與后臺開發(fā)人員進(jìn)行數(shù)據(jù)聯(lián)調(diào)時，總會遇到煩人的跨域問題！

解決跨域的方法有很多種，比如你和后臺人員經(jīng)過友好協(xié)商后，你可以通過JSONP的方式或者讓后臺人員將代碼設(shè)置為允許你進(jìn)行跨域！但是往往前后臺開發(fā)人員的配合默契度是不太高的。如果后臺只給你接口，并明確告訴你不允許修改接口，怎么辦？怎么辦才能實現(xiàn)跨域？此時你就可以通過proxyTable來解決跨域問題！
通過proxyTable解決跨域在Vue-cli當(dāng)中是很簡單的。只需修改config文件夾下的index.js中的proxyTable就能實現(xiàn)：

//代理配置表，在這里可以配置特定的請求代理到對應(yīng)的API接口
proxyTable:{
    "/api":{
        target:"http://www.zhangpeiyue.com",//訪問的服務(wù)器地址
        changeOrigin:true,//true為開啟代理
        //secure: true, // 如果是https接口，需要配置這個參數(shù)
        pathRewrite:{
            '^/api': '/'//路徑的替換規(guī)則
           /*
            *這里的配置是正則表達(dá)式，以/api開頭的路徑將會被‘/'替換掉
            *假如后臺文檔的接口是 "http://www.zhangpeiyue.com/user/add"
            *前端調(diào)取API接口應(yīng)寫：axios.get('/api/user/add')
            */
        }
    }
}

以上代碼的“/api"你可以認(rèn)為用于代替target里面的地址，調(diào)取接口的地址直接用api來替換。
比如后臺接口地址為："http://www.zhangpeiyue.com/user/login"。
你可以直接寫為："/api/user/login"即可。
當(dāng)然，你也可以根據(jù)不同的API域名所負(fù)責(zé)的模塊不同來進(jìn)行多項配置：

//代理配置表，在這里可以配置特定的請求代理到對應(yīng)的API接口
proxyTable:{
    "/adv":{
        target:"http://adv.zhangpeiyue.com",//訪問的服務(wù)器地址
        changeOrigin:true,//true為開啟代理
        pathRewrite:{
            '^/adv': '/'//路徑的替換規(guī)則
        }
    }，
    "/user":{
        target:"http://user.zhangpeiyue.com",//訪問的服務(wù)器地址
        changeOrigin:true,//true為開啟代理
        pathRewrite:{
            '^/user': '/'//路徑的替換規(guī)則
        }
    }
}

以上代碼"/adv"與"/user"分別負(fù)責(zé)項目中的廣告模塊與用戶模塊。
例如：
后臺文檔的地址是：“http://adv.zhangpeiyue.com/add”，
前端調(diào)取API接口應(yīng)寫：axios.get('/adv/add')

注意：

配置修改完以后一定要重新npm run dev 一次

補充：

changeOrigin的屬性值為一個布爾值，如果設(shè)置為true，那么本地會虛擬一個NODE服務(wù)端接收你的請求并代你發(fā)送該請求(中間件)。因為服務(wù)端語言是沒有跨域問題的，所以這樣最終就解決了跨域問題了。不過這只適用于開發(fā)環(huán)境，上線后可以使用反向代理nginx。