这是一个通过XHR2在浏览器中预加载MP4视频文件的工作代码。每当我们执行preloadMe();时，视频就会开始预加载和合成进度事件。并在文件完全加载preload.oncomplete时触发，我们可以检测到。

问题是我希望能够pause和resume进行预加载过程吗？ 使用中止方法将终止整个请求。我希望以后能够恢复并在我暂停时继续下载文件。

任何建议将不胜感激！

注意：在这个主题上，关于StackOverflow并没有任何实际答案。

这是主要代码：

(function (global,factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
    typeof define === 'function' && define.amd ? define(factory) :
    (global.Preload = factory());
}(this,(function () { 'use strict';

    function preloadOne(url,done) {
        const xhr = new XMLHttpRequest();
        xhr.open('GET',url,true);
        xhr.responseType = 'blob';
        xhr.onprogress = event => {
            if (!event.lengthComputable) return false
            let item = this.getItemByUrl(event.target.responseURL);
            item.completion = parseInt((event.loaded / event.total) * 100);
            item.downloaded = event.loaded;
            item.total = event.total;
            this.updateProgressBar(item);
        };
        xhr.onload = event => {
            let type = event.target.response.type;
            let blob = new Blob([event.target.response],{ type: type });
            let url = URL.createObjectURL(blob);
            let responseURL = event.target.responseURL;
            let item = this.getItemByUrl(responseURL);
            item.blobUrl = url;
            item.fileName = responseURL.substring(responseURL.lastIndexOf('/') + 1);
            item.type = type;
            item.size = blob.size;
            done(item);
        };
        xhr.send();
    }

    function updateProgressBar(item) {
        var sumCompletion = 0;
        var maxCompletion = this.status.length * 100;

        for (var itemStatus of this.status) {
            if (itemStatus.completion) {
                sumCompletion += itemStatus.completion;
            }
        }
        var totalCompletion = parseInt((sumCompletion / maxCompletion) * 100);

        if (!isnaN(totalCompletion)) {
            this.onprogress({
                progress: totalCompletion,item: item
            });
        }
    }

    function getItemByUrl(rawUrl) {
        for (var item of this.status) {
            if (item.url == rawUrl) return item
        }
    }

    function fetch(list) {  
        return new Promise((resolve,reject) => {
            this.loaded = list.length;
            for (let item of list) {
                this.status.push({ url: item });
                this.preloadOne(item,item => {
                    this.onfetched(item);
                    this.loaded--;
                    if (this.loaded == 0) {
                        this.oncomplete(this.status);
                        resolve(this.status);
                    }
                });
            }
        })
    }

    function Preload() {
        return {
            status: [],loaded: false,onprogress: () => {},oncomplete: () => {},onfetched: () => {},fetch,updateProgressBar,preloadOne,getItemByUrl
        }
    }

    return Preload;

})));

以下是启动预加载的功能：

function preloadMe(){

const preload = Preload();

preload.fetch([
    'https.../video.mp4'

]).then(items => {
  // use either a promise or 'oncomplete'
  console.log(items);
});

preload.oncomplete = items => {
  console.log(items);
  console.log("The video has been preloaded!");
}

preload.onprogress = event => {
  console.log(event.progress + '%');
}

preload.onfetched = item => {
  console.log(item);
}
};