axios的跨域问题

参考：https://www.cnblogs.com/l-y-h/p/11815452.html

一、main.js

import Vue from "vue";
import "./plugins/axios";
import App from "./App.vue";
import router from "./router";
import store from "./store";

// step1：引入 axios
import Axios from 'axios'

Vue.config.productionTip = false;

// step2：把axios挂载到vue的原型中，在vue中每个组件都可以使用axios发送请求,(我的设置不成功)
// 不需要每次都 import一下 axios了，直接使用 $axios 即可
// Vue.prototype.$axios = Axios


// step3：使每次请求都会带一个 /api 前缀 
Axios.defaults.baseURL = '/api'

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");

二、vue.config.js

module.exports = {
  lintOnSave: false,
  devServer: {
    proxy: {
        '/api': {
            // 此处的写法，目的是为了 将 /api 替换成 https://www.baidu.com/
            target: 'http://localhost:8999/json/getdiff',
            // 允许跨域
            changeOrigin: true,
            ws: true,
            pathRewrite: {
                '^/api': ''
            }
        }
    }
}
};

三、对应view中

methods: {
            getgrouplist() {
                 let oldJSON;
                 let newJSON;
                 axios.get('/',{
                     params: {
                         oldUrl: ‘123',
                         newUrl: '456'
                     }
                 }).then(function (resp){
                     oldJSON = JSON.stringify(resp.data.data.old);
                     // alert(oldJSON);
                     newJSON = JSON.stringify(resp.data.data.new);
                 })
                
                this.oldStr = JSON.stringify(oldJSON, null, 4);
                this.newStr = JSON.stringify(newJSON, null, 4);
            },