Question

我正在使用以下代码在浏览器中播放声音：

HTML

<audio id="' + newMessageSoundObjectId + '"><source src="sound.mp3" type="audio/mpeg"></audio>

JavaScript

this.newMessageSoundObject = document.getElementById(newMessageSoundObjectId);
// ...
var playPromise = this.newMessageSoundObject.play();
if (playPromise !== undefined) {
    playPromise.then(function() {
      // Automatic playback started!
    }).catch(function(error) {
      console.error("Sound was not played: " + error);
     });
}

大多数情况下，它运行良好，但是有时它会随机停止工作几分钟，然后重新启动，而无需重新加载页面或导航。而且，控制台不会出错。

有关更多上下文，它用于在用户收到新消息时播放通知。

是否有更好的方法来确保播放声音？

Answer 1

您可能会遇到这样的情况，即它在等待任何剪辑完成之后才响应任何新的点击。

如果是这样，请在函数的开头插入以下代码，以在每次单击剪辑时重置剪辑：

audio.currentTime = 0; // On each click, rewind clip to start

它看起来像这样：

if (playPromise !== undefined) {
    playPromise.then(function() {
    audio.currentTime = 0; // On each click, rewind clip to start
      // Automatic playback started!
    }).catch(function(error) {
      console.error("Sound was not played: " + error);
     });

您可能需要考虑调整代码，这样可以使代码更简洁。我还没有测试过，但是应该可以正常工作：

const soundObject = document.querySelector("#newMessageSoundObjectId");

soundObject.addEventListener("mousedown", playClip);

function playClip() {
    audio.currentTime = 0; // On each click, rewind clip to start
    audio.play();
} else {
    console.error("Something went wrong");

声音并不总是在玩JavaScript

1 个答案: