Vue中proxyTable配置

关于Vue中使用ajax请求数据时存在跨域问题

Vue在开发中使用的localhost本地服务，而请求的数据则是在服务端http://www.admin.com/php/getData.php，坑定是存在跨域问题，因此须要使用代理来帮我作一些处理来解决跨域问题：

proxyTable: {
  '/api': {
    target: 'http://www.admin.com/', 
    changeOrigin: true,
    pathRewrite: {
      '^/api': ''
    }
  }
}
复制代码

pathRewrite中^/api的意思就是把/api，替换成''，把左边的内容替换成右边的。

如上图，target直接写成http://www.admin/com便可，而后使用一个标识api来替代当前的主机名，在页面中请求地址写上 this.$ajax.get('api/getData.php')便可。固然这只是在本地服务能够的。

相信不少朋友第一次试用的时候也会遇到这样的问题，打包上线后请求失败，地址错误。不少老司机会教你一个方法，就是在全部接口中把api/删掉。固然了，这个方法是能够的，可是一个项目中有好多接口，若是一个一个的去删除的话，那么，你一天啥都不用干了，只去删接口，而后本地测试你再加回去。 以下图就是，线上地址多了一个api，怎么解决呢

proxyTable: {
  '/php': {
    target: 'http://www.admin.com/', 
    changeOrigin: true,
    pathRewrite: {
      '^/php': ''
    }
  }
}

好比还有一个接口http://www.admin.com/php/getMessage.php，
他们中有公共的一个名字，那就是php
把标识中的api使用一个接口中公共的名字，变成入上面代码同样，这样打包上线后你的整个地址就是http://www.admin.com/php/getData.php，就能够成功访问了。


勿喷，大神们可能有更好的办法复制代码