通过xmlhttprequest下载mp3文件，并将其保存为文件，以便以后上传

download mp3 file through xmlhttprequest and save it as a file somewhere for upload later

本文关键字：文件 保存 下载 xmlhttprequest mp3 通过      更新时间：2023-09-26

我目前正在编写一个chrome扩展，我卡在如何处理xmlhttprequest的responsetext作为一个文件。正如标题所说，我需要下载mp3给出一个链接，并将其保存为一个真正的物理文件的任何地方，我可以再次访问我的扩展。我似乎找不到关于如何从javascript中保存文件的信息，因为类型不是简单的文本。任何帮助都是感激的，谢谢。

这个函数在您的示例中使用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);
相关文章：