4 vue开发环境下跨域问题

1 跨域问题 

跨域产生的原因：浏览器的同源策略不允许跨域访问，所谓同源策略是指协议、域名、端口相同。

2 解决方法：采用proxyTable解决。

2.1 proxyTable是什么？

vue-cli提供的解决vue开发环境下跨域问题的方法，它是http代理中间件，依赖于node.js。

2.2 基本原理

基本原理是用服务端代理解决浏览器跨域：

cms跨域解决原理：
1、访问页面http://localhost:12001/
2、页面请求http://localhost:12001/cms。由于url由http://localhost:12001/cms...改为“http://localhost:31001/cms."，所以不存在跨域
3、通过proxyTable由node服务器代理请求 http://localhost:31001/cms。服务端访问不存在跨域问题。

2.3 具体配置

在config/index.js下配置proxyTable。以/api/cms开头的请求，代理请求http://localhost:31001

 '/api/cms': {
        target: 'http://localhost:31001',
        pathRewrite: {
          '^/api': ''
   }