使用 JavaScript 和 HTML5 音频存储和播放本地文件答案

【问题标题】：Storing and playing local files with JavaScript and HTML5 Audio使用 JavaScript 和 HTML5 音频存储和播放本地文件
【发布时间】：2015-11-17 07:18:42
【问题描述】：

我正在开发一个媒体播放器，我希望能够将本地文件排列在一个数组中，进行播放，甚至将其导出为播放列表（供以后导入）。

我发现了这个问题，其中包含很多有用的信息： Using local file for Web Audio API in Javascript 但是，Base64 方法会使播放列表太大，other 解决方案会创建一个沙盒文件链接（会话关闭时会从浏览器中删除）。

有什么好的办法吗？

编辑：这是我想要的一个例子：

var playlist = {'file:///home/user/music/track1.mp3','file:///home/user/music/track2.mp3','file:///home/user/music/track3.mp3'};

它不必看起来像这样，我只是想要类似的东西。

【问题讨论】：

您希望将文件保存在某个地方，即使会话已关闭？
@NevinMadhukarK 我想引用用户硬盘上的文件，这样他就可以制作一个播放列表并稍后再次加载。

标签： javascript arrays html audio

【解决方案1】：

为什么不试试 html5 上的 localstorage 功能。即使在会话过期后，它也有助于存储数据。

http://www.w3schools.com/html/html5_webstorage.asp

http://diveintohtml5.info/storage.html

我在音乐播放器中所做的是将文件数据路径存储在本地存储中。每当我需要它时，我都会检索它并将当前歌曲替换为我想要的歌曲。

// 存储 localStorage.setItem("路径","file:///home/user/music/track1.mp3'");

//检索
currentSong=localStorage.getItem('Path');

对于多首歌曲，你可以创建对象并执行类似的操作： Storing Objects in HTML5 localStorage

【讨论】：

我回家后会测试一下！我可以将完整的 localStorage 导出到文件吗？我可以用它来存储整个播放列表。
您可以将存储在localStorage中的整个对象文件以JSON格式传输到一个文件中。请检查我提供的最后一个链接。这帮助我完成了我的项目。 :) 如果对您有所帮助，请接受我的回答。 :)
我尝试了您的方法 (jsfiddle.net/Tv8Cm/56)，但在尝试加载文件时出现错误“Not allowed to load local resource: file:///file.mp3”。我的代码有问题吗？
我认为你应该检查一下：stackoverflow.com/questions/10813408/html5-video-not-playing 我 100% 确定，我告诉的方法会起作用。当你有未来的疑问时，只需谷歌。都在那里。
你好，你能提供工作小提琴或你的播放器的链接吗？因为我很确定你不能真正重用保存的文件路径