javascript - 通过 xmlhttprequest 下载 mp3 文件并将其保存为文件以供稍后上传

Question

我目前正在编写一个 chrome 扩展程序，并被困在如何将 xmlhttprequest 的响应文本作为文件处理。正如标题所说，我需要下载给定链接的 mp3 并将其保存为真实的物理文件，任何我可以在我的扩展中再次访问的地方。鉴于类型不是简单的文本，我似乎无法找到有关如何从 javascript 保存文件的信息。任何帮助表示赞赏，谢谢。

Answer 1

thi 是在您的情况下使用 xhr 加载和 mp3 的函数，转换为 base64 然后使用 base64 文件字符串执行函数

var xhrfile=function(i,f){
 var c=new XMLHttpRequest();
 c.open('GET',i);
 c.responseType='arraybuffer';
 //c.onprogress=function(e){var perc=Math.round((e.loaded/e.total)*100)+' of 100'};
 c.onload=function(e){
  var u8=new Uint8Array(this.response),ic=u8.length,bs=[];
  while(ic--){bs[ic]=String.fromCharCode(u8[ic]);};
  f('data:audio/mpeg;base64,'+btoa(bs.join('')));
 };
 c.send();
}

用法：

 xhrfile('http://domain.com/your.mp3',filefunc)

现在，当您要保存文件时，请使用 indexedDB、websql、localstorage、fileApi 或任何您想要的......它现在是一个字符串。

考虑到这个提到的保存可能性有文件大小限制。

您也可以简单地输出要下载的文件：

var filefunc=function(mp3data){
 var a=document.createElement('a');
 a.download='mp3name.mp3';
 a.href=mp3data;
 a.innerText='download the file';
 document.body.appendChild(a);
}

我没有用 mp3 测试这个功能...我知道它适用于图像和其他小文件。也许从一个小的 mp3 文件开始。

这是blob版本。

var xhrfile=function(i,f){
 var c=new XMLHttpRequest();
 c.open('GET',i);
 c.responseType='arraybuffer';
 c.onload=function(e){
  var blob = new Blob([this.response]);
  f(blob);
 };
 c.send();
}

blob 到对象 url：

var objurl=window.URL.createObjectURL(blob);

空闲内存

window.URL.revokeObjectURL(objurl);