如何播放音频?

我正在使用HTML5和JavaScript制作游戏。

如何通过JavaScript播放游戏音频?

当前回答

如果你得到以下错误:

DOMException: play()失败，因为用户没有首先与文档交互。

这意味着用户需要首先与网站进行交互(正如错误消息所说)。在这种情况下，您需要使用点击或只是另一个事件监听器，以便用户可以与您的网站进行交互。

如果你想自动加载音频，并且不希望用户首先与文档交互，你可以使用setTimeout。

setTimeout（（） => { document.getElementById（'mySound'）.play（）; }, 500) <audio id=“mySound” src=“sound.mp3”></audio>

声音将在0.5秒后开始。

2018-08-02 15:53:47

其他回答

我有一些问题与播放音频，特别是因为Chrome已经更新，用户必须首先与文档交互。

然而，在我发现的几乎所有解决方案中，JS代码都必须主动设置监听器(例如按钮点击)来接收用户事件，以便播放音频。

就我而言，我只是想让游戏在玩家与之互动时播放BGM，所以我为自己设置了一个简单的监听器，不断检查网页是否正在进行互动。

const stopAttempt = setInterval(() => {
    const audio = new Audio('your_audio_url_or_file_name.mp3');
    const playPromise = audio.play();
    if (playPromise) {
      playPromise.then(() => {
        clearInterval(stopAttempt)
      }).catch(e=>{
        console.log('' + e);
      })
    }
}, 100 )

2019-09-05 13:28:10

添加一个隐藏的<audio>元素，并按所示播放。

function playSound(url) {
  var ourAudio = document.createElement('audio'); // Create a audio element using the DOM
  ourAudio.style.display = "none"; // Hide the audio element
  ourAudio.src = url; // Set resource to our URL
  ourAudio.autoplay = true; // Automatically play sound
  ourAudio.onended = function() {
    this.remove(); // Remove when played.
  };
  document.body.appendChild(ourAudio);
}

2016-08-05 19:51:34

http://www.schillmania.com/projects/soundmanager2/

SoundManager 2提供了一个易于使用的API，允许声音在任何现代浏览器中播放，包括IE 6+。如果浏览器不支持HTML5，那么它可以从flash中获得帮助。如果你想严格使用HTML5而不使用flash，这里有一个设置，preferFlash=false

它在iPad、iPhone (iOS4)和其他支持html5的设备+浏览器上支持100%无flash音频

使用简单如下:

<script src="soundmanager2.js"></script>
<script>
    // where to find flash SWFs, if needed...
    soundManager.url = '/path/to/swf-files/';

    soundManager.onready(function() {
        soundManager.createSound({
            id: 'mySound',
            url: '/path/to/an.mp3'
        });

        // ...and play it
        soundManager.play('mySound');
    });
</script>

这里有一个实际的演示:http://www.schillmania.com/projects/soundmanager2/demo/christmas-lights/

2012-02-23 18:50:34

这是我在一个婴儿AI项目上提出的一些JS。我希望这对你有所帮助。

<!DOCTYPE html>
<html>
<head>
    <title>
        js prompt AI
    </title>
    <style>
        #button {
            border: 1px solid black;
            border-radius: 10px;
            font-size: 22px;
            height:65px;
            width:100px;
            text-align: center;
            line-height: 65px;
        }
    </style>
</head>
<body>

    <audio id="myAudio" src="./how_are_you.m4a"></audio>
    <p>To Interact with the AI please click the button</p>
    <div id=button>click</div>

    <script>

       var button = document.getElementById("button");
       function playBack() {
           button.addEventListener("click", function (){
            var talk = prompt("If you wish for the AI to respond type hi");
            var myAudio = document.getElementById("myAudio");

            if(talk === "hi") {
                    myAudio.play();
            }
           }) ;



       }
       playBack();
   </script>
</body>

</html>

2019-03-29 02:51:47

你可以使用Web Audio API来播放声音。有相当多的音频库，如嚎叫.js, soundjs等。如果你不担心旧的浏览器，那么你也可以查看http://musquitojs.com/。它提供了一个简单的API来创建和播放声音。

例如，要播放一个声音，你所要做的就是。

import $buzz from 'musquito';

const buzz = $buzz('gunfire.mp3');

buzz.play();

该库还支持音频精灵。

2018-06-25 15:52:54

如何播放音频?

推荐文章

最新文章

标签