权威指南之脚本化http

Posted 2020-06-14

使用javascript代码操作http是可行的。当用脚本设置window对象的location属性或调用表单对象的submit方法时，都会初始化http请求。这两种情况下，浏览器会加载新页面。

ajax描述了一种使用脚本操纵http的web应用框架。ajax应用的主要特点是使用脚本操纵http和web服务器进行数据交换，不会导致页面重载。在某种意义上，comet与ajax相反。在comet中，web服务器发起通信并异步发送消息到客户端。如果web应用要相应服务器发送的消息，则它会使用ajax技术发送或请求数据。

实现ajax和comet的方式有很多种，而这些底层的实现有时称为传输协议。例如 img元素有一个src属性。当脚本设置这个属为url时，浏览器发起的httpget请求会从这个url下载图片。因此，脚本通过设置img元素的src属性，且把信息作为图片url的查询字符串部分，就把能经过编码信息传递给web服务器。img元素无法实现完整的ajax传输协议。因为数据交换生单向的

为了把iframe作为ajax传输协议使用，脚本首先要把发送给web服务器的信息编码到url中，然后设置iframe的src属性为该url。服务器能创建一个包含响应内容的html文档，并把它返回给web浏览器，并且在iframe中显示它。iframe需要对用户不可见，例如可以使用css隐藏它，脚本能通过遍历ifame的文档对象来读取服务器的响应。这种房屋受限于同源策略

实际上 script元素的src属性能设置url并发起htttpget请求，使用script元素实现脚本操作http是非常吸引人的。因为他们可以跨域通信而不受限于同源策略。使用基于script的ajax传输协议时，服务器的响应采用json编码的数据格式，当执行脚本时，javascript解析器能自动将其解码。由于他使用json数据格式，因此这种ajax传输协议也叫做jsonp

所有浏览器都支持XMLHttpRequest对象，它定义了API，除了常用的GET请求，这个API还包括实现POST请求的能力，同时它能用文本或Document对象的形式返回服务器的响应。

浏览器在XMLHttpRequest类上定义了它们的http API.这个类的每个实例都表示一个独立的请求/响应对，并且这个对象的属性和方法允许指定请求细节和提取相应数据

使用这个HTTP API必须做的第一件事就是实例化XMLHttpRequest对象

var request=new XMLHttpRequest();

也能重用已存在的XMLHttpRequest，但注意这将终止之前通过该对象挂起的任何请求。ie7之前的版本不支持非标准的XMLHttpRequest（）构造函数，但能模拟

if(window.XMLHttpRequest===undefined){
  window.XMLHttpRequest=function(){
    try{
      return new ActiveXOject("Msxml2.XMLHTTP.6.0");
    }
    catch(e1){
      
      try{
        return new ActiveXObject("Msxml2.XMLHTTP.3.0");
      }
      catch(e2)
      {
        throw new Error("XMLHttpRequest is not supported");
        
      } 

    }
    
  };

}