在一次開發項目中，使用的是vue框架，請求數據使用的是axios請求。如果你怎麼都沒做按如下代碼請求，
圖1：請求後臺數據代碼
就會發生跨域報錯問題：
圖2：跨域報錯問題
如果請求數據的url不寫域名和端口，那麼報錯404，前面那種是找到了請求所在地，但是不允許被跨域，那麼如何解決的呢，我就說說網上的說的方法：
第一種：先在main.js做如下配置：
圖3：main.js配置axios
然後在config的index.js中做如下代理配置：
圖4：index.js的代理配置
然後圖1的請求路徑變為/api/Lottory/Dataxls,運行結果仍然為404，也就是說上述的方法是無效的，反正我main.js全局配置後，請求都是錯誤的。不過下面這種方法解決了我的問題，不過不是全局配置，僅在組件中配置，在配置完成圖4的基礎上，在使用的組件中引入axios，其他代碼如下：
能實現跨域操作的方法
這個代碼就可以實現後臺訪問，其中api,就是你的目標域名與端口。經在index.js重定向訪問，這樣就實現了跨域請求往返數據。也可以利用此url，直接利用jquery的ajax進行請求，亦能夠直接請求成功，而不用設置成jsonp形式(如果沒有相關配置，也會跨域錯誤)，數據請求成功如下：
請求成功的數據返回形式
至於全局的跨域請求配置實現，之前失敗了幾次，我暫時還沒有去研究它，歡迎大家一起討論，有解決的大神，貼上代碼，同時如發現本文有不嚴謹之處，請多加指出，感激不盡！
原創不易，歡迎大家點贊，發表看法，謝謝!
分享到:
