JavaScript高级程序设计(第3版)阅读笔记第03天-ajax和Comet

第21章ajax与Comet

本章内容

*使用XMLHttpRequest对象
*使用XMLHttpRequest事件
*跨域Ajax通信的限制
  ajax是对Asynchronous JavaScript+XML的简写。这一技术能够向服务器请求额外的数据而无需卸载页面。
  ajax技术的核心是XMLHttpRequest对象(简称XHR),可以使用XHR对象获取新数据,然后再通过DOM将新数据插到页面中。
使用XMLHttpRequest构造函数
var xhr = new XMLHttpRequest();

调用这个方法

xhr.open("get","example.txt",false);
xhr.send(null);
  这里的send()方法接收一个参数,即要作为请求主体发送的数据。如果不需要通过请求主体发送数据,则必须传入null,因为这个参数对于有些浏览器是必需的。调用send()之后,请求就会被分派到服务器。
  由于这次请求时同步的,JavaScript代码会等到服务器响应之后再继续执行。在收到响应后,响应的数据会自动填充XHR对象的属性。
  *responseText:作为响应主体被返回的文本。
  *responseXML:如果响应的是”text/xml”或”application/xml”,这个属性中将保存着响应数据的XML DOM文档。
  *status:响应的HTTP状态。
  *statusText:HTTP状态的说明。
  在接收到响应后,第一步是检查status属性,以确定响应已经成功返回。一般来说,可以将HTTP状态代码为200作为成功的标志。304表示请求的资源并没有被修改,可以直接使用浏览器中缓存的版本。
  多数情况,要发送异步请求,才能让JavaScript继续执行而不必等待响应。同城,支队readyState值为4,所有数据都已经就绪。必须在调用open()之前制定onreadystatechange时间处理程序才能保证浏览器兼容性。
var xhr = createXHR();
xhr.onreadystatechange = function(){
     
    if(xhr.readystate == 4){
        if((xhr.status>=200 && xhr.status<300)||xhr.status == 304){
            alert(xhr.responseText);
        }else{
            alert("request was successful:"+xhr.status);
        }
    }
};
xhr.open("get","example.txt",true);
xhr.send(null);
  在接收响应之前还可以调用abort()方法来取消异步请求。
xhr.abort()

HTTP头部信息

  *accept:浏览器能够处理的内容类型。
  *connection:浏览器与服务器之间连接的类型。
  *cookie:当前页面设置的任何cookie。
  *host:发出请求的页面所在的域。
  *referer:发出请求的页面的url。

其他跨域技术:

1.图像Ping
  图像Ping是与服务器进行简单、单向的跨域通信的一种方式。响应可以是任何内容,通常是像素图或204响应。通过图像Ping,浏览器得不到任何具体的数据,可以通过监听load和error事件,能知道响应是什么时候接收到的。
var img= new Image();
img.onload = img.onerror = function(){
     
    alert("done");
};
img.src = "http://www.example.com/...";

图像Ping最常用于跟踪用户点击页面或动态广告曝光次数。有两个缺点,一是只能发送GET请求,二是无法访问服务器的响应文本。只能用于浏览器与服务器间的单向通信。

2.JSONP
  JSONP是JSON with padding (填充式JSON或参数式JSON)的简写,看起来和JSON差不多,只不过是被包含在函数调用的函数。
callback({
     "name":"nicholas"});
  JSONP由两部分组成:回调函数和数据。
http://freegeoip.net/json/?callback=handlePesponse
  这个地址是在请求一个jsonp地理定位服务,这里指定的回调函数的名字是handlePesponse()
  JSONP是通过动态

你可能感兴趣的:(阅读笔记,ajax,其他跨域技术,javascript)