前端网络高级篇（四）CORS 跨域

学习CORS之前，先看下如下问题，作为铺垫和准备。

问题1: 什么是跨域？

满足下面三个条件才会引发跨域问题：

1. 浏览器限制： 出于安全考虑，浏览器会限制脚本中发起的跨域请求（浏览器对于javascript的同源策略的限制）
2. 同源策略： 只要 协议，域名，端口有任何一个的不同，就被当作是跨域
3. 请求类型： XMLHttpRequest类型请求

问题2: 为什么要有跨域限制？

AJAX同源策略主要用来防止CSRF攻击。如果没有AJAX同源策略，相当危险，我们发起的每一次HTTP请求都会带上请求地址对应的cookie，那么可以做如下攻击：

1. 用户登录了自己的银行页面 http://mybank.com，http://mybank.com 向用户的cookie中添加用户标识。
2. 用户浏览了恶意页面 http://evil.com 。执行了页面中的恶意AJAX请求代码。
3. http://evil.com 向http://mybank.com 发起AJAX HTTP请求，请求会默认把http://mybank.com 对应cookie也同时发送过去。
4. 银行页面从发送的cookie中提取用户标识，验证用户无误，response中返回请求数据。此时数据就泄露了。
5. 而且由于Ajax在后台执行，用户无法感知这一过程

问题3:为什么表单请求可以跨域

A页面（域名A）用 form 提交表单到B页面（域名B），A页面的脚本无法获取B页面中的内容，无法获得响应，浏览器认为是安全的。
其实，请求已经发送出去了，只是拿不到响应而已，AJAX 接收方可以读取响应内容的。所以，利用这个特性，依然有可能发起CSRF攻击。

问题4: 如何解决跨域问题？

• 方式一：jsonp
  浏览器对资源文件的请求不限制同源，比如a.com下的页面可以通过标签