跨域问题之ajax

前端跨域问题比较集中的出如今ajax跨域上，事实上我也回答过不少相关的问题，线上线下都有。这里简单的列举几类。

首先澄清一点，浏览器的同源策略引发了跨域访问限制这个问题。同源策略的初衷是阻止恶意js脚本访问其余域的敏感数据（设想其余网站的js代码能够调用你网银的支付或者转帐功能）。但有不少网站，先后台不在同一个域下，或者多个域下的几个子页面须要交换数据，这就必须绕过同源策略，这就是跨域。针对要访问资源的不一样，跨域有不少种方式，今天说的是ajax的跨域问题。但咱们不讨论具体的实现，只是列举我解答过的几种问题。这几种问题回答的次数都很多，具备广泛性，因此以为有必要记录一下。

为何form表单能够直接访问后台API，ajax不行？

跨域问题针对的是比较危险的js代码，不会阻止其余动做触发的跨域访问。

为何ajax发出了而且后台正确相应（好比返回码是200 OK），而后才是浏览器阻止跨域并报错？

首先同源策略是浏览器自己的策略，这意味后台服务器并不关心前台是否跨域。因此数据没问题的话，后台能够正常返回结果。

当浏览器收到服务器的返回数据以后，检查来源，发现和脚本的执行方并不属于同一域，而且未发现后台容许此域下脚本访问（根据一组http header，这个我会另开一篇文章单独说明），因而丢弃结果并报告错误。注意，此时js脚本不能收到数据。

有的同窗可能要问为何浏览器不在尽量早的时候阻止对后台的访问？由于浏览器并不能肯定后台是否容许访问，因此它必须等到后台返回，检查结果中是否包含一组特殊的http header，以说明脚本执行方是否有访问权限。若是有，则将数据转交给js代码，若是没有，则丢弃结果，报告错误。

为何我使用了jquery 的jsonp，但依然没法获得后台的数据？

jsonp须要后台配合你，也便是，后台也须要实现相关的功能。使用jsonp访问访问任何受限制的API，是不可能的。

---

欢迎你们留言，若是有比较典型的问题，我会继续追加到这篇文章后面，谢谢。

若是对你有所帮助或者启发，请帮我点赞和收藏。