接口跨域问题本质是：

Vue项目运行地址 与 API 接口运行的地址不一致，由于当前的 API 接口没有开启 CORS 跨域资源共享，因此默认情况下，接口无法请求成功。

解决办法为通过代理解决接口的跨域问题，思路如下：

1、 把 axios 的请求根路径设置为 vue 项目的运行地址(接口请求不再跨域)

2、 vue 项目发现请求的接口不存在，把请求转交给 proxy 代理

3、 代理把请求根路径替换为 devServer.proxy 属性的值，发起真正的数据请求

4、 代理把请求到的数据，转发给 axios

如何在项目中配置proxy代理：

步骤1，在 main.js 入口文件中，把 axios 的请求根路径改造为当前 web 项目的根路径:

// axios.defaults.baseURL = 'http://myjson.dit.upm.es' // 配置请求根路径 axios.defaults.baseURL = 'http://localhost:3000'

步骤2，在项目根目录下创建 vue.config.js 的配置文件，并声明如下的配置:

module.exports = { devServer: { port: 3000, open: true, proxy: 'http://myjson.dit.upm.es' } }

注意: 1、devServer.proxy 提供的代理功能，仅在开发调试阶段生效
2、项目上线发布时，依旧需要 API 接口服务器开启 CORS 跨域资源共享