使用html5文件系统api获取本地mp3文件的元数据

我试图获取目录中每个mp3文件的标题和艺术家（以及其他元数据）。目前，我已经将div“thelist”添加到mp3文件的文件名中。我怎么能得到文件的标题和艺术家属性/标签而不是整个文件名？使用html5文件系统api获取本地mp3文件的元数据

这里是我的代码：

<!DOCTYPE html> 
<html> 
<head> 
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> 
<title>Get Directory</title> 
<script type="text/javascript" src="jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("#file-input").on("change", function(e){ 
    var thefiles = e.target.files; 
    $.each(thefiles, function(i, item){ 
    var thefile = item; 
    $("#thelist").append("FILES: " + thefile.name + "<br />");; 
    }); 
}); 
}); 
</script> 
</head> 
<body> 
<input type="file" id="file-input" webkitdirectory="" directory=""> 
<div id="thelist"></div> 
</body> 
</html>

来源

2013-01-20 jgille07

看起来你需要使用的FileReader抢依次对每个文件，并使用提取的ID3标签中的数据 - http://ericbidelman.tumblr.com/post/8343485440/reading-mp3-id3-tags-in-javascript

是这是你正在读取服务器上的文件（也就是说，你可以在这个服务器端有更多的选项），或者你试图从用户机器读取，这将是更多的挑战...

更新：查看下面我的评论（1/22）中引用的jsFiddle，该工作示例合并了上面的代码和jDataView子例程。它只适用于.mp3文件，那些必须有有效的ID3标签（我编辑了VLC中的几个mp3文件，以确保它们没问题，iTunes没有这样做）。只在OSX上的Chrome上进行测试，但希望能够让你开始，但请记住HTML5的实现不同浏览器到浏览器和平台到平台

来源

2013-01-21 22:41:10 Offbeatmammal

我试图获取目录中每个文件的文件名，然后读取元数据使用Javascript/jQuery的mp3文件。我对使用文件系统API非常陌生，所以如果有人知道在哪里可以找到一个完整的示例，或者可以轻松地创建一个自己的示例，它们在非常基本的上下文中依次显示每个进程或两个进程，。 – jgille07

看到这个jsFiddle http://jsfiddle.net/MnzkR/为一个工作示例 – Offbeatmammal

谢谢，这个例子很好。我遇到的唯一问题是，当我尝试从超过100个文件的目录中获取标记时，浏览器会崩溃。我正在使用最新版本的Chrome。 “显示此网页时发生错误，请继续重新加载或转到另一页”页面。对于如何解决这个问题，有任何的建议吗？我是否应该得到目录中文件的总数，然后将它们分成小于100的组，并逐组检索它们的标签？或者有一个简单的技巧来处理这个问题？ – jgille07

使用html5文件系统api获取本地mp3文件的元数据

回答

相关问题