關於vue-resource在dev環境下跨域問題的解決方法

跨域問題

• 相信跨域問題是每一個前端在ajax請求中都會遇到的問題,由於瀏覽器的同源策略的限制,因此ajax是不支持跨域的,固然當後臺在沒有完成搭建的時候,這時候咱們須要使用到模擬數據的時候,這時候不少的api就會出現跨域問題;在vue-resource中固然這個問題也不例外;以下

  

  因此在此我也就整理出了相應的解決方法.

解決方法

• 直接在瀏覽器中安裝插件解決跨域問題,(僅限google)

  咱們通常調試也是在google中調試,強大的google固然也是有許多開發者工具;如今我就說一個google的解決跨域問題的方法,安裝一個名字叫allow-control-allow-origin的插件,下面附上連接
  我是連接
  就是下圖這個插件,由於是google的,固然下載要無障礙上網大家知道的,
  

  下載完成後會在瀏覽器的插件窗口看到一個綠色的小logo,
  

  只要將調試連接加入到這個裏面,就能夠在google瀏覽器裏面調試了,不會有跨域的問題了

• 修改的vue-cli的配置文件

  由於vue-cli是使用的webpack打包的,因此咱們須要在config文件夾裏面配置,找到config文件夾的index.js的proxyTable中配置一些咱們所須要的東西:

proxyTable: {
                  '/data':{
                    target: 'http://v.juhe.cn',
                    changeOrigin: true,
                    pathRewrite: {
                      '^/data': ''
                    }
                  }

由於我測試使用的是聚合的api,而後url只須要/data/someKey這種格式就能夠了!
個人網站裏還有更多關於vue更詳細的小方法,歡迎來看看

搬磚小網站
個人github上面也有使用vue-cli搭建的項目,喜歡的能夠star一下哦!!!
github地址

以上是我總結的vue在dev環境中一些解決方法,但願能幫到大家!