jQuery文件上传进度功能 xhr.timeout设置Ajax请求超时

1.jQuery文件上传进度功能

1、核心思路：
1、自定义带有upload.onprogress 进度处理逻辑的XMLHttpRequest对象
2、改变$.ajax方法内部本身的XMLHttpRequest为带有upload.onprogress 进度处理逻辑的XMLHttpRequest对象
2、核心代码

 $.ajax({  
     xhr: function () {
     let new_xhr = new XMLHttpRequest();
     new_xhr.upload.onprogress = function (e) {
             if(e.lengthComputable){ // 是否可计算长度
                    e.loaded  //已经上传的长度
                    e.total  // 要上传的总长度
               }                         
      }
        return new_xhr;
      }})

2.xhr.timeout设置Ajax请求超时

1、什么是Ajax请求超时
在指定时间内服务器没有响应Ajax请求，那么这次请求即为超时，默认是0，即没有超时

2、流浏览器对于同域名Http请求数的限制

如果一个请求的响应时间太长对于浏览器而言会产生什么影响？
3、异步对象请求超时处理
let xhr = new XMLHttpRequest();
xhr.open();
xhr.timeout = 500; // 表示服务器在500毫秒之内没有响应则自动终止当前ajax请求
xhr.send();
xhr.onload = function () {}