自定义XMLHttpRequest请求获取二进制流

admin 发布时间:2016-10-15 分类:Web 阅读:8340次 添加评论

jquery.ajax返回的数据类型只有html,json等,没有处理图片、文件等的数据流。

jquery在提高开发效率的时候也牺牲了一部分灵活性,碰到这种情况我们可以写一个自定义的XMLHttpRequest请求函数替换jquery.ajax。

因为在请求中需要添加自定义的header头,下面是核心代码(Html5):

var xhr = new XMLHttpRequest();
xhr.open("get", url, true);
xhr.responseType = "blob";
//添加请求头
xhr.setRequestHeader("Auth", "password");
xhr.onload = function () {
    if (this.status == 200) {
        var blob = this.response;
        var img = document.createElement("img");
        img.onload = function (e) {
            //图片加载完成释放资源
            window.URL.revokeObjectURL(img.src);
        };
        img.src = window.URL.createObjectURL(blob);
        $("body").html(img);
    }
};
xhr.send();

XMLHttpRequest 在前一代时候返回类型responseType只支持DOMString和Document数据类型,在新一代标准下添加了更多数据类型。如:FormData、Blob、File、ArrayBuffer。

暂无留言

发表评论:

◎欢迎您的参与讨论。