脚本化http(一)

来源：互联网发布：淘宝海淘怎么加入编辑：程序博客网时间：2024/06/14 08:15

http协议概述

这里写图片描述

兼容的XMLHttpRequest写法

//为了兼容低版本的ie浏览器我们需要这样来写兼容代码if(window.XMLHttpRequest === undefined){     window.XMLHttpRequest = function(){        try{            return new ActiveObject('Msxml2.XMLHTTP.6.0');        }catch(error){            try{                 return new ActiveObject('Msxml2.HTTP.3.0');            }catch(error){                 throw new Error('XMLHttpRequest is not supported!');            }        }     }}

获取纯文本和强制同步获取

//关于http 函数的封装问题function getText(url,callback){    var request = new XMLHttpRequest();    request.open('GET',url);    request.onreadystatechange = function(){        if(request.readyState ===4 && request.status ===200){           var type = request.getResponseHeader('Content-Type');           if(type.match(/^text/)){              callback(request.responseText);           }        }    }    request.send(null);}//进行强制同步function getTextNotAsyn(url){    var request = new XMLHttpRequest();    request.open('GET',url,false);    request.send(null);    if(request.status !== 200){ throw new Error(request.statusText)}    var type = request.getResponseHeader('Content-Type');    if(!type.match(/^text/)){        throw new Error('Expected textual response got:'+type);    }    return request.responseText;}

封装get函数

//编写一个可以进行请求同时也能够对返回的内容进行解析function get(url,callback){     var rq = new XMLHttpRequest();     rq.open('GET',url);     rq.onreadystatechange = function(){         if(rq.readyState === 4 && rq.status ===200){             var type = rq.getResponseHeader('Content-Type');             if(type.indexOf('xml') && rq.responseXML){                 callback(rq.responseXML);             }else if(type ==='application/json'){                 callback(JSON.parse(rq.responseText));             }else{                 callback(rq.responseText);             }         }     }}

对数据进行编码

function encodeFormData(data){  if(!data) return;  var pairs = [];  for(var name in data){    if(!data.hasOwnProperty(name)){ continue;}    if(typeof data[name] === 'function') continue;    var value = data[name];    name = encodeURIComponent(name.replace('%20',"+"));    value = encodeURIComponent(value.replace('%20','+'));    pairs.push(name+'='+value);  }}

使用表单编码数据发起一个http post请求

//使用表单编码数据发起一个http post请求function postData(url,data,callback){  var request = new XMLHttpRequest();  request.open('POST',url);  request.onreadystatechange = function(event){    event = event || window.event;    if(request.readyState ===4 && callback){         callback(request);    }  }  request.setRequestHeader('Content-Type','application/x-www-form-urlencoded');  request.send(encodeFormData(data));}

使用表单编码数据发起一个get请求

function getData(url,data,callback){  var request = new XMLHttpRequest();  request.open("GET",url+"?"+encodeFormData(data));  request.onreadystatechange = function(){    if(request.readyState ===4 && callback){       callback(request);    }  }  request.send(null);}

使用json编码的请求发送http post 请求

function postJSON(url,data,callback){    var request = new XMLHttpRequest();    request.open("POST",url);    request.onreadystatechange = function(){      if(request.readyState === 4 && callback){         callback(request);      }    }    request.setRequestHeader('Content-Type','application/json');    request.send(JSON.stringify(data));}

待续…

0 0