h5跨域访问图片_HTML5解决跨域问题

HTML5解决跨域问题

由于浏览器的同源策略，网络连接的跨域访问是不被允许的，XHR对象不能直接与非同源的网站处理数据交互。而同源指的是什么呢？同源的范畴包括：规则(协议)，主机号(域名、ip等)，端口号。

但是随着开放，共享平台的流行，跨域访问的需求愈加强烈。目前最常用的跨域方案是动态加入script标签，这多少有点hack的意味，跨域访问似乎一直没有什么安全且光明正大的办法。

终于，HTML5提供的XMLHttpRequest Level2实现了跨域访问以及其他的一些新功能。下面我们会详细讨论一下：

XMLHttpRequest  Level2

XHR2是HTML5新特性中的一个(事实上没有什么XHR1，XHR2这样的概念，XHR2只是HTML5提供的一套新的规范)，在原有XHR对象上新增了一些功能：跨域访问，全新的事件，还有请求进度以及响应进度。

目前浏览器对于XHR2的兼容列表：

u Chrome              2.0以上

u Firefox              3.5以上

u Internet Explorer      不支持

u Opera               不支持

u Safari               4.0以上

原理：

正常情况下，我们书写一个XHR示例：

var xhr = new XMLHttpRequest();

xhr.open('GET', 'http://baidu.com', true); //访问baidu.com