使用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文件的元數據

回答

相關問題