原生js请求

原文地址：https://m.jb51.net/article/122797.htm

XMLHttpRequst详解：http://caibaojian.com/ajax-jsonp.html

主要是用XMLHttpRequest ,主要分三个步骤

• 实例化 XMLHttpRequest 对象。

• 根据请求过程处理请求结果

• 调用open方法，发送请求地址和参数以及请求方式， 建立连接

• 调用send方法发送请求

  function xhrAjax(obj,success,fail){
          var xhr = new XMLHttpRequest();

          xhr.onreadystatechange=function(){
                  if(xhr.readystate==4){
                          var status = xhr.status ;
                          if(status >= 200 && status <300 ){
                                  var response = xhr.responseText;
                                  success(response);
                          }else{
                                  fail(status);
                          }
                  }
          };
          //prams的格式 name=sekin&&age=13 格式是要自己去处理的    
          switch (obj.method){
                  case "get" :      
                        xhr.open(obj.method,obj.url+"?"+obj.params,true);//true表示异步
                        xhr.send(null);
                        break;
                  case "post" :
                          xhr.open(obj.method,obj.url);
                          xhr.setRequestHeader("Content-Type", obj.contentType);// application/json application/x-www-form-urlencoded              
                          xhr.send(params);
                        break;

          }                  
  }

XMLHttpReaues 请求的过程中readstate的状态共有5个

• 0：请求还没有开始，未调用open 方法

• 1：建立请求连接，调用open方法

• 2：发送请求参数，调用send方法

• 3：正在响应请求结果，还没响应完成

• 4：请求响应完成。

原生的js请求方法xhrAjax写好了，参数有三个 obj：发送XMLHttpRequest请求的类型和参数,以及post方法的请求头类型，success:成功的回调涵，fail:失败的回调函数。

现在，当我们返回的是文档流的时候：

var obj = {
        url:"www.test.com/test",
        method:"post",
        contentType:"application/json",
        params:JSON,stringify({
            arr:[
                    {name:"1",age:"23"},
                    {name:"2",age:"27"},
                ],
            id:"3456",
        }),
};

xhrAjax(obj,success,fail);

function fail(status){
    alert(status);
}

function success(response){
    var readFile = new FileReader();
    var fileBase64 = readRile.readAsDataURL(respose); //把二进制的文档流转化成base64,可直接放在地址里
    //转发的过程
    readFile.onload=function(e){
        var aEl = document.createElement("a");
        aEl.download="xxx.xlsx";//命名文件名；
        aEl.href = e.target.result;
        document.body.appendChild(aEl);
        aEl.click();
        document.body.removeChild(aEl);
    }
};