跨域问题

1.document.domain + iframe(只有在主域相同的时候才能使用该方法)

2.window.name+iframe

window对象有个name属性，该属性有个特征：即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的，每个页面对window.name都有读写的权限，window.name是持久存在一个窗口载入过的所有页面中的，并不会因新页面的载入而进行重置。

3.window.postMessage+iframe

4.location.hash + iframe

5.动态创建script

6.图像Ping

7.WebSocket

web sockets在一个单独的持久连接上提供全双工、双向通信。(同源策略对web sockets不适用)，在js创建了web socket之后，会有一个HTTP请求发送到浏览器以发起连接，取得服务器响应后，建立的连接会使用HTTP升级从HTTP协议交换为web sockt协议。只有在支持web socket协议的服务器上才能正常工作。

优点：能够在客户端和服务器之间发送非常少量的数据，而不必担心HTTP那样字节级的开销。

缺点：制定协议的时间比制定javascript API的时间还要长。

var socket = new WebSockt('ws://www.example.com');//http->ws; https->wsssocket.send('hello WebSockt'/JSON);socket.onmessage = function(event){    var data = event.data;}

8. SSE

9.jsonp

function handleResponse(response){    console.log('The responsed data is: '+response.data);}var script = document.createElement('script');script.src = 'http://www.freegeoip.com/json/?callback=handleResponse';document.body.insertBefore(script, document.body.firstChild);

1）安全问题(请求代码中可能存在安全隐患)

2）要确定jsonp请求是否失败并不容易

10.Comet

两种实现方式：长轮询和流；

长轮询：页面发起一个到服务器的请求，然后服务器保持连接打开，直到有数据可发送，发送完数据后，浏览器关闭连接，随即又发起一个到服务器的请求。优势是所有浏览器都支持，使用XHR对象和setTimeout()就能实现。

在流（streaming）模式中，在页面的整个生命周期内只使用一个HTTP连接，浏览器向服务器发送一个请求，而服务器保持连接打开，然后周期性地向浏览器发送数据。所有服务器端语言都支持打印到输出缓存然后刷新的功能，这正是实现HTTP流的关键所在。

在Firefox、Safari、Opera和Chrome中，通过侦听readystatechange事件及检测readyState的值是否为3，就可以利用XHR对象实现HTTP流。使用XHR实现HTTP流的典型代码：

function createStreamingClient(url, progress, finished){    var xhr = new XMLHttpRequest(),         recieved = 0;    xhr.open("get", url, true);    xhr.onreadystatechange = function(){        var result;        if(xhr.readyState == 3){            result = xhr.responseText.substring(recieved);            recieved += result.length;            progress(result);        } else if (xhr.readyState == 4){            finished(xhr.responseText);        }    };    xhr.send(null);    retrun xhr;}var client = createStreamingClient("streaming.php", function(data){    alert("recieved: "+data);    }, function(data){        alert("Done");});

11.CORS

CORS使用自定义HTTP头部让浏览器与服务器进行沟通，从而决定请求或响应是成功，还是失败。

请求Origin头部(包含源信息：协议、域名。端口)：Origin:http://www.nczonline.net

服务器响应：Access-Control-Allow-Origin:http://www.nczonline.net

若无此头部或者有头部但源信息不匹配，浏览器会驳回请求(请求和响应都不包含Cookie.)

1.IE对CORS的实现(不包含cookie，只能设置请求头部信息中的Content-Type，不能访问响应头部信息，只支持GET和POST)

var xdr = new XDomainRequest();xdr.onload = function(){    console.log(xdr.responseText);}xdr.onerror = function(){    console.log("an error");}xdr.timeout = 1000;xdr.ontimeout = function(){    console.log("request took too long");};xdr.open('get', 'http://www.somewhere-else.com/page/');xdr.contentType = "application/x-www-form-urlencoded"xdr.send(null);

在请求前调用abort()方法可以终止请求。

2. 其他浏览器对CORS的实现(不包含cookie，不能设置请求头部，不能访问响应头部信息，可访问xhr.status和xhr.statusText)

var xhr =  new XMLHttpRequest();xhr.onreadystatechange = function () {    if(xhr.readyState == 4){        if(xhr.status >= 200 && xhr.status < 300 || xhr.status == 304){            console.log(xhr.responseText);        }    }}xhr.open('get', 'http://www.somewhere-else.com');......xhr.send(null);

3.跨浏览器的CORS

function createCORS(method, url){    var xhr = new XMLHttpRequest();    if('withCredentials' in xhr){        xhr.open(method, url, true);    }else if(typeof XDomainRequest != 'undefined'){        var xhr = new XDomainRequest();        xhr.open(method, url);    }else{        xhr = null;    }    return xhr;}var request = createCORS('get', 'http://www.somewhere-else.com');if(request){    request.onload = function(){        ......    };    request.send();}