vue 解決跨域

 先上報錯 以表尊重 

 

 

在vue中 找到 config文件夾中的 index.js文件 

配置更改以下

proxyTable: {
        '/api': {
          target: 'http://47.240.11.236:8080', //設置你調用的接口域名和端口號 別忘了加http
          changeOrigin: true, //這裡true表示實現跨域
          pathRewrite: {
            '^/api': '/' //這裏理解成用‘/api’代替target裏面的地址，後面組件中咱們掉接口時直接用api代替 好比我要調用'http://47.240.11.236:8080/json.json'，直接寫‘/api/json.json’便可
          }
        },
      },

組件中使用

export default {
  data() {
    return {};
  },
  mounted() {
    this.$axios.get("/api/json.json").then(function(response) {
            console.log(response);
      }).catch(function(error) {
            console.log(error);
      });
  }
};

若是你走到了這一步 掉進了坑裏  那麼獲得的結果是    跨域的報錯變成了404報錯  

記得你改的是配置文件~~~~~~~要重啓~~~~~~~~~~我必定是最貼心的博主 在這個坑裏呆了一個小時纔上來    看到的同窗們記得重啓服務哦~

正確結果

 

 或者還能夠這樣改

 proxyTable: {
        '/': {
          target: 'http://47.240.11.236:8080',
          changeOrigin: true
        },
      }

調用:
  this.$axios.get("json.json").then(function(response) {
            console.log(response);
      }).catch(function(error) {
            console.log(error);
      });