解决vue项目中前后端交互的跨域问题、nginx代理配置

最近新接了一个项目，需要自己写一个小demo和后端联调，第一次用自己写的demo和后端联调，出现了问题。

问题：Access to XMLHttpRequest at ‘http://192.168.0.78:8080’ from origin ‘http://192.168.0.79:2022’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

vue向后端发送请求时时，被浏览器CORS阻止。

跨域指浏览器不允许当前页面的所在的源去请求另一个源的数据。源指协议，端口，域名。只要这个3个中有一个不同就是跨域。

我们使用axios解决跨域问题。

1.安装axios

在控制台npm install axios

在main.js中加入这两行代码

import axios from 'axios'
Vue.prototype.$axios = axios

大功告成，接下来就可以使用axios了。

2.解决跨域问题

首先在config下的index.js文件中添加代码：

 proxyTable: {
      '/api': {
        target: 'http: