【发布时间】：2015-12-17 18:16:21
【问题描述】：
我一直在建立一个网站来销售我的乐器/音乐，并试图找到一种方法来创建一个简单的 .MP3 音频播放器按钮，以防止用户右键单击将目标另存为...同时隐藏实际的 .MP3文件链接。我还需要它一次只播放一种声音（防止声音重叠。）我发现，如果可以听到它，它很可能会被下载。
我发现的方法（在 stackoverflow 社区的帮助下）并不是 100% 完全防止用户查找和下载您的 .mp3 文件，但它会使其变得更加困难。
https://jsfiddle.net/9a9jbqzz/1/
步骤
-
（可选） 第一步是将声音文件的名称转换为像 MD5 散列这样令人困惑的名称（这不是 100% 必要的，但它使它变得更棘手），因为在这个例子中，我将采用值 'control.mp3' 和 'smooth.mp3' 然后将它们转换为它们的 md5 哈希值。 Link to online MD5 Hash Converter （你也可以随意命名它们，比如 12345abc 等等。）
MD5 哈希形式的 control.mp3 = cef83b993c716dd543b6fa4f053cc4a4
MD5 哈希形式的平滑.mp3 = cbbe0ab9d89c68f24f4fadff907fa720
现在我有了文件名的 MD5 哈希版本。我会将我的 MP3 文件重命名为相应的 MD5 哈希。 cef83b993c716dd543b6fa4f053cc4a4.mp3 and cbbe0ab9d89c68f24f4fadff907fa720.mp3
- 我现在准备好编写代码了：
HTML：
<p><span class="play" key="cef83b993c716dd543b6fa4f053cc4a4">Play</span></p>
<p><span class="play" key="cbbe0ab9d89c68f24f4fadff907fa720">Play</span></p>
（注意你看到的只是 'Key = cef83b993c716dd543b6fa4f053cc4a4' 而不是 src=path/control.mp3）
CSS：
.play
{
color:green;
cursor:pointer;
}
.pause
{
color:red;
cursor:pointer;
}
（我会这样做，所以当单击 css 更改时，您可以编辑它以具有背景图像按钮或您喜欢的任何内容，例如，这只是简单的颜色更改）
jQuery：
$(".play").on('click',function(){
var key = $(this).attr('key');
EvalSound(key);
var this_play = $(this);
$(".play").each(function() {
if ($(this)[0] != this_play[0]) {
$(this).removeClass("pause");
}
});
$( this ).toggleClass( "pause" );
});
var thissound = new Audio();
var currentKey;
var interval;
function EvalSound(key) {
if(currentKey !== key)
thissound.src = "http://99centbeats.com/beats/" + key + ".mp3";
currentKey = key;
if (thissound.paused) {
thissound.play();
interval = setInterval(function() {
if(thissound.currentTime == thissound.duration) {
clearInterval(interval);
$('.play').removeClass("pause");
}
},100);
} else {
thissound.pause();
thissound.currentTime = 0;
currentPlayer = thissound;
clearInterval(interval);
}
}
（你可以把它放在一个 .js 文件中，并将它命名为真正令人困惑的东西，比如 md5 哈希，<script src="c50ea22a5484a69f1eb22f8aaccae296.js"></script> 只需确保它位于 HTML 之后才能正常工作。） p>
这种方法不是 100% 完美的，不会阻止所有用户下载您的 .mp3 文件，但它不会像右键单击保存目标那样简单。如果您想以销售音乐为生，您可能需要使用它。实际上，似乎那些愿意付费的人无论如何都会付费，而那些不付费就下载它的人也会这样做，所以最后你并没有真正停止太多，但这是我想要的技术学习和实施。我决定分享这个，因为我真的找不到任何地方可以做到这一点，你可能想做一些不同的事情，但这可能会给你一些想法。感谢帮助我编写代码的人！
一些有帮助的 stackoverflow / jsfiddle 帖子：
Stopping/Pausing audio when another audio file is clicking using jQuery
Javascript Audio -- multiple play buttons on page with separate audio files
【问题讨论】：
标签： javascript jquery audio hash