在vue项目中发请求时报了No ‘Access-Control-Allow-Origin’ header is present on the requested resource这个错误，这个错误就是典型的跨域问题

之所以会引发跨域问题，是因为

• 不同协议的网站不能相互访问
  https://baidu.com 不能访问 http.baidu.com ，因为他们一个是http协议，一个是https协议
• 不同ip或者域名下的网站不能相互访问
  https://baidu.com 不能访问 https://csdn.com
  http://10.111.115.31 不能访问http://12.889.64.31
• 通过域名或者ip访问同一台服务器也属于跨域
  假设http://10.111.115.31映射的域名是www.abc.com，它们之间相互访问就属于跨域问题。

因为一般我们的本地服务器地址是localhost8080，而后台给我们的地址可能是http://xxxx8181的，所以就会产生跨域的问题。要解决这个问题，如果你是vue项目且用axios的话，可以按照以下步骤进行解决。

1.在config文件下的index.js中的proxyTable加入以下代码：

 proxyTable: {
      '/api':{
        target: "http://123.xx.xx.xx:8181/shoppiing/",
        changeOrigin:true,
        pathRewrite:{
            '^/api':''
        }
      }
    },

2.在main.js添加axios的baseURL和hearder：

（请求地址可以看作是baseURL+url）

import Vue from 'vue'
import App from './App'
import Axios from 'axios'

Vue.prototype.$axios = Axios
Axios.defaults.baseURL = '/api'
Axios.defaults.headers.post['Content-Type'] = 'application/json';

Vue.config.productionTip = false

3.然后发请求的时候就可以直接发了：

async reginst () {
        const res = await this.$http.post('user/add', this.Rform)
        console.log(res)
      },

这里的this.Rform是我发post请求时要携带的数据，此案例中我所请求的地址为http://123.xx.xx.xx:8181/shopping/user/add