我的网络应用程序用户如何单击按钮来播放本地存储的 mp3 文件？

Posted 2023-02-25

【中文标题】我的网络应用程序用户如何单击按钮来播放本地存储的 mp3 文件？

【英文标题】：How can my web app user click a button to play a locally stored mp3 file?

【发布时间】：2015-09-13 01:21:26

【问题描述】：

我想让我的用户单击页面上的曲调列表中的一个按钮来打开一个简单的 mp3 播放器（html5 播放器很好），该播放器可以播放存储在用户的硬盘。这甚至可能吗？我尝试过的每一次尝试——使用 HTML 和/或 JS、JQ——都失败了。

我可以将本地 mp3 文件路径/文件名复制到我的 Chrome 地址栏中。完全没有代码，它有助于在新选项卡中打开一个 HTML5 播放器，让我可以很好地播放音乐。为什么让用户通过点击我的应用程序中的一个按钮来做同样的事情如此困难？

我已经能够让一个 mp3 播放器出现在页面上。但无论我如何指定文件路径，它都拒绝播放 - 偶尔会告诉我我的代码不允许访问本地文件。

【参考方案1】：

出于安全原因，javascript 无权修改文件，甚至在客户端计算机上打开文件。 如果这绝对是您想要完成的，请尝试使用 JAVA 小程序。

【讨论】：

感谢您的快速回复。我以为几年前我已经使用 js 完成了这项工作。我一定是错的，或者我可能是从我的 xampp 服务器运行它的。我不熟悉 Java 小程序，但这是否意味着我的客户必须下载小程序并安装它？我想如果他/她可以从我的服务器上获取它，那将会带来类似的安全风险。

我对 JAVA 小程序也不熟悉，但我记得它们只需要在他们的机器上安装 JAVA。当它们在某个页面上执行时，它们会请求用户授权。示例：他们是这个页面中的一个小程序，用于确定访问者的本地IP地址：mon-ip.com/adresse-ip-locale.php

我尊重保护用户隐私的努力。我想我需要重新考虑是否真的要提供这个功能。我确实觉得令人费解的是，如果网络应用程序访问本地数据是如此危险，那么为什么我的亚马逊音乐播放器允许我从云或从我的计算机上下载的版本访问特定的 mp3？这确实告诉我，这并非不可能。

我不知道 Amazing music 是如何工作的，但 Chrome 正在尝试实现 FileSystem，以便在沙盒环境中读取和写入文件。但我怀疑这将是标准化的。 more info here.

【参考方案2】：

感谢 Lyes Ben。在过去的几天里，考虑您的 cmets 帮助我理解了我所尝试的方法不是正确的 - 以及为什么。经过一些研究，我现在相信使用 DropBox api 我可以编写一个简单的“drop-in-saver”功能，它不仅可以自动将我的用户通过应用程序生成的文件保存在本地，而且同时提供我列表中的另一个功能 - 它可以让用户离线访问这些文件。作为奖励，文件将在所有用户的设备上同步，应用程序中没有额外的代码或复杂性。

有时我过于专注于解决一个特定的技术问题，以至于我没有退后一步，问它是否是首先要解决的正确问题。

这还没有完成，但我现在正在处理我的应用程序的 DropBox 界面。当（如果）我到达那里时，我会更新这个答案，因为我怀疑在某些情况下，对于面临类似问题的其他人来说，这可能是一个解决方案。