> For the complete documentation index, see [llms.txt](https://sekin.gitbook.io/myjs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sekin.gitbook.io/myjs/wang-luo-qing-qiu/yuan-sheng-js-qing-qiu.md).

# 原生js请求

原文地址：[**https://m.jb51.net/article/122797.htm**](https://m.jb51.net/article/122797.htm)

**XMLHttpRequst详解：**[**http://caibaojian.com/ajax-jsonp.html**](http://caibaojian.com/ajax-jsonp.html)

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

* 实例化 XMLHttpRequest 对象。
* 根据请求过程处理请求结果
* 调用open方法，发送请求地址和参数以及请求方式， 建立连接
* 调用send方法发送请求

```javascript
  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:失败的回调函数。

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

```javascript
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);
    }
};
```