使用 html5 文件系统 api 获取本地 mp3 文件的元数据
Posted
技术标签:
【中文标题】使用 html5 文件系统 api 获取本地 mp3 文件的元数据【英文标题】：Get metadata of local mp3 file using html5 filesystem api 【发布时间】：2013-01-20 13:29:07 【问题描述】：我试图获取目录中每个 mp3 文件的标题和艺术家（以及最终的其他元数据）。目前，我的代码将 div“thelist”附加到 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>
【问题讨论】：
【参考方案1】：看起来您需要使用 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 实现因浏览器和平台而异
【讨论】：
我正在尝试获取目录中每个文件的文件名，然后使用 Javascript/jQuery 读取 mp3 文件的元数据。我对使用文件系统 API 非常陌生，所以如果有人知道在哪里可以找到完整的示例，或者可以轻松地自己制作一个示例，分别显示这些过程中的每一个，或者在非常基本的上下文中按顺序显示这两个过程，那将非常有帮助. 谢谢，这个例子很好用。我遇到的唯一问题是，当我尝试从包含大约 100 个文件的目录中获取标签时，浏览器会崩溃。我正在使用最新版本的 Chrome。 “哦，快。尝试显示此网页时出现问题。继续重新加载或转到另一个页面”页面显示。对于如何解决这个问题，有任何的建议吗？我是否应该获取目录中文件的总数，然后将它们分成少于 100 个的组并逐组检索它们的标签？还是有一个简单的技巧来处理这个？ 您可能希望分成更小的小组，并确保随时释放资源 - 我没有花太多时间优化垃圾收集等解决方案 我已经让它适用于其中包含 200-300 个文件的目录，但它仍然会在包含更多文件的目录中崩溃。对于包含 1000 多个文件的目录，我将如何着手进行这项工作？是否可以？我的分组方法合乎逻辑且有效吗？我在每个循环的第二个末尾添加的 setTimeout 函数是否有助于读取大量文件？这是我的代码的 jsFiddle 的链接：jsFiddle Code Page 需要第 61-63 行吗？完成 dv 后，您可能希望将其设置为空（有助于垃圾收集）。此外， var 阅读器可能会超出循环，因此您只需更新一次。我没有 1000 多个文件的 mp3 目录可以轻松测试，但是您是否在控制台日志中收到任何错误（可能在 jsErrLog.appspot.com 中挂钩以记录正在发生的事情）以上是关于使用 html5 文件系统 api 获取本地 mp3 文件的元数据的主要内容，如果未能解决你的问题，请参考以下文章