Question

我已经查看了类似问题的其他答案，不幸的是，我似乎无法弄清楚我的代码需要改变什么。

这是我处理声音的组件：

// https://glitch.com/edit/#!/smiling-armchair
AFRAME.registerComponent('soccer-audiohandler', {
        init:function() {
            let playing = false;
            var el = this.el;
            let audioEl = document.querySelector("a-sound");
            audioEl.setAttribute("src", "#soccer-game");

            audioEl.addEventListener("loaded", (e) => {
                console.log("AUDIO LOADED")
                console.log(e)
                var audio = audioEl.components.sound;
                el.addEventListener('click', (ee) => {
                    console.log(ee)
                    if(!playing){
                        audio.playSound();
                    } else {
                        audio.stopSound();
                    }
                    playing = !playing;
                });
            })
    }
})

以下是渲染组件的场景

<!DOCTYPE html>
<html>
  <head>
 <script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>
 <script src="https://unpkg.com/aframe-environment-component@1.0.0/dist/aframe-environment-component.min.js"></script>
 <script src="https://npmcdn.com/aframe-animation-component@3.0.1"></script>
 <script src="https://npmcdn.com/aframe-event-set-component@3.0.1"></script>
 <script src="https://npmcdn.com/aframe-layout-component@3.0.1"></script>
 <script src="https://npmcdn.com/aframe-template-component@3.1.1"></script>
  <script src="component/soccer-audiohandler.js"></script>
</head>
<body>
  <!-- Try changing the preset to one of default, contact, egypt, checkerboard, forest, goaland, yavapai, goldmine, 
     threetowers, poison, arches, tron, japan, dream, volcano, starry, osiris. -->
<!-- See more environment options: https://github.com/feiss/aframe-environment-component#parameters -->
<a-scene cursor="rayOrigin:mouse" environment ="preset:goaland" >
    <a-assets>
        <a-sound src="some/path/here" id="soccer-game"></a-sound>
    </a-assets>
      <!--https://github.com/aframevr/aframe/blob/master/docs/components/geometry.md-->
    <!--https://github.com/aframevr/aframe/blob/master/docs/components/sound.md-->
    <a-text font="kelsonsans" value="click to play sound" width="8" position="0 2.25 -5" rotation="0 15 0"></a-text>
    <a-sound geometry="primitive:box; width: 1; height: 1; depth: 1;"
             position="1 1 -5"
             autoplay="false"
             soccer-audiohandler src='#soccer-game'></a-sound>
</a-scene>
</body>
</html>

我知道问题不在于路径，因为当我将它加载到360度图像库中时，音频播放效果很好，但它不会加载到上面的场景中。我尝试过使用.wav文件和.ogg文件。我也尝试缩短音频，因为原来很长。有人对我如何解决这个问题有任何建议吗？

Answer 1

您应<audio>使用<a-sound>代替<a-assets>，如here所述。

工作小提琴here。

错误：在A帧环境中播放声音时无法解码音频数据

1 个答案: