从Blob网址创建下载链接 [英] Create a download link from a Blob URL

问题描述

在我正在处理的Google Chrome扩展中，使用 XMLHttpRequest 从服务器下载文件。该文件包含一些存储在 ArrayBuffer 对象中的二进制数据。为了提供下载此文件的可能性，我使用 createObjectURL API。

  function publish（data）{
 if（！window.BlobBuilder&& window.WebKitBlobBuilder）{
 window.BlobBuilder = window.WebKitBlobBuilder; 
} 
 var builder = new BlobBuilder（）; 
 builder.append（data）; 
 var blob = builder.getBlob（）; 
 var url = window.webkitURL.createObjectURL（blob）; 
 $（＃output）。append（$（< a />）。attr（{href：url}）。append（Download））; 
  

}

工作正常;不同之处在于文件名是不透明的UUID，例如 9a8f6a0f-dd0c-4715-85dc-7379db9ce142 。有没有办法强制这个文件名更方便使用？

解决方案

我从来没有尝试过，但它应该可以创建一个新的File对象（它允许你指定一个文件名）并将你的blob写入它。 （b）b
$ b

 函数publish（data，filename）{
 
 if（！window .BlobBuilder& window.WebKitBlobBuilder）{
 window.BlobBuilder = window.WebKitBlobBuilder; 
 
 $ b $ fs.root.getFile（filename，{
 create：true 
}，function（fileEntry）{
 
 //为我们的FileEntry（log.txt）创建一个FileWriter对象。
 fileEntry.createWriter（function（fileWriter）{
 
 fileWriter.onwriteend = function（e）{
 console.log （'Write completed。'）; 
}; 
 
 fileWriter.onerror = function（e）{
 console.log（'Write failed：'+ e.toString（） ）; 
}; 
 
 var builder = new BlobBuilder（）; 
 builder.append（data）; 
 var blob = builder.getBlob（）; 
 fileWriter.write（blob）; 
 
，errorHandler）; 
 
}，errorHandler）; 
} 
  

我认为这可以适用于您。

In a Google chrome extension I am working on, a file is downloaded from a server with an XMLHttpRequest. This file contains some binary data which are stored in an ArrayBuffer object. In order to provide the possibility to download this file I am using the createObjectURL API.

function publish(data) {
  if (!window.BlobBuilder && window.WebKitBlobBuilder) {
    window.BlobBuilder = window.WebKitBlobBuilder;
  }
  var builder = new BlobBuilder();
  builder.append(data);
  var blob = builder.getBlob();
  var url = window.webkitURL.createObjectURL(blob);
  $("#output").append($("<a/>").attr({href: url}).append("Download"));

}

It is working fine; except that the filename is an opaque UUID like 9a8f6a0f-dd0c-4715-85dc-7379db9ce142. Is there any way to force this filename to something more user-friendly?

解决方案

I have never tried it before, but it should be possible to create a new File object (which allows you to specify a file name) and write your blob to it. Something along the lines of:

function publish(data, filename) {

    if (!window.BlobBuilder && window.WebKitBlobBuilder) {
        window.BlobBuilder = window.WebKitBlobBuilder;
    }

    fs.root.getFile(filename, {
        create: true
    }, function (fileEntry) {

        // Create a FileWriter object for our FileEntry (log.txt).
        fileEntry.createWriter(function (fileWriter) {

            fileWriter.onwriteend = function (e) {
                console.log('Write completed.');
            };

            fileWriter.onerror = function (e) {
                console.log('Write failed: ' + e.toString());
            };

            var builder = new BlobBuilder();
            builder.append(data);
            var blob = builder.getBlob();
            fileWriter.write(blob);

        }, errorHandler);

    }, errorHandler);
}

I think this could work for you.

这篇关于从Blob网址创建下载链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！