前后端分离开发必须解决的就是跨域问题了，在这里记录一下关于在前端vue跨域的方法，以供参考

使用npm命令下载axios

npm install axios

新建vue.config.js文件

目标转发的地址localhost:后的端口跟下面后端配置文件设置的端口保持一致

//配置请求转发的代理

//定义代理的对象
let proxyObj = {};

//拦截http请求
proxyObj['/'] = {
    ws: false,  //关掉websocket
    target: 'http://localhost:8181', //目标转发的地址
    changeOrigin: true,
    pathRewrite:{  //请求地址重写
        '^/': ''  //拦截到的地址不去修改它
    }
};

//把上面的导出来
module.exports = {
    devServer:{  //配置开发环境
        host: 'localhost', //端口号
        port: 8080,
        proxy: proxyObj  //代理对象
    }
};

配置main.js

在main.js中加上以下配置

import axios from 'axios';

Vue.prototype.axios = axios;
axios.defaults.withCredentials = true


Vue.config.productionTip = false
Vue.use(axios);

后端改端口

在后端的application.yml中设置服务器端口

server:
  port: 8181

是不是觉得很简单，这样我们就可以进行前后端分离开发啦，可以在前端js中使用axios调用接口：

this.axios.get('/user/findAll').then(res => {              
				//需要把地址前面部分删除
                console.log(res)
            }

打开浏览器F12检查console，在后端定义了findAll接口的前提下，就可以看到res了。