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

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


当前回答

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

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

import $buzz from 'musquito';

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

buzz.play();

该库还支持音频精灵。

其他回答

new Audio('./file.mp3').play()

如果你不想打乱HTML元素:

var audio = new Audio('audio_file.mp3');
audio.play();

功能播放(){ var audio = new audio ('https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3'); audio.play (); } <按钮onclick = "打()“>播放音频> < /按钮

这使用了HTMLAudioElement接口,它以与<audio>元素相同的方式播放音频。


如果你需要更多的功能,我使用了嚎叫.js库,发现它简单而有用。

< script src = " https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.1/howler.min.js " > < /脚本> < >脚本 var声音=新的嚎叫({ src(“https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3”):, 体积:0.5, Onend:函数(){ 警报(“完成了!”); } }); sound.play () > < /脚本

这是我在一个婴儿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>
var song = new Audio();
song.src = 'file.mp3';
song.play();

我有一些问题与播放音频,特别是因为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 )