跨域及解决跨域的几种方式

什么是跨域？

网页所在的URL的协议、域名、端口号和ajax请求url的协议、域名、端口号有其中一个不同的就为跨域

跨域是浏览器对ajax请求作出的限制

解决跨域的方式

1. jsonp方式：需要后端配合，现在基本没人用

2. cors(cross-origin resource sharing):跨域资源共享

   后端加字段Access-Control-Allow-Origin()：

   • * 代表允许所有；

   • 字段和值 代表允许哪些源地址去请求这些服务器

     如：Access-Control-Allow-Origin()：taobao.com, jd.com 就是允许淘宝和京东访问

3.代理转发 

利用第三者(中间服务器转发) 因为服务器与服务器之间没有同源策略 proxy做代理服务器配置 

model.exports = {
	devServer: {
		port: 3000,  // 改变端口号
    proxy: {  // 跨域代理服务器的配置
      '/api': {   // 请求以 /api开头的，才会走到这里的配置(自己的请求地址)
        target: 'http://c.m.163.com',   // 要去的目标地址域名
        changeOrigin: true,   
        pathRewrite:{   // 路径重写，把/api开头的路径替换成空字符串， 
          //然后与target做完整的拼接(这个地方用不用重写， 取决于服务器接口的url)
          '^/api': ''
        }
      }
    }
}
}

 对于changeOrigin的理解

当target指定的值是域名的时候，需要开启为true, 是node-http-proxy内部的要求
如果target参数配置的值是ip，不加也行，要是实际的域名地址，就开启true，就能正确代理完成跨域

官方文档这么说：The origin of the host header is kept when proxying by default, you can set changeOrigin to true to override this behaviour. It is useful in some cases like using name-based virtual hosted sites.
解释：默认情况下，host头部会保持原样不变，我们可以设置为true来覆盖这个行为，比如，前端服务器是localhost:8888,后端服务是localhost：8082，后端去拿你的host的时候拿到的还是localhost:8888， 但是加了true之后，拿到的host就是localhost:8082了