angularjs p5.js在没有用户交互的情况下无法工作

tyg4sfes  于 7个月前  发布在  Angular
关注(0)|答案(3)|浏览(59)
let gameFound; 

function preload() {
  gameFound = loadSound('/audio/SFX_-_Game_found_03.mp3');
}

function setup() {
  createCanvas(400, 400);
}

function gameFoundSound(){
  gameFound.play();
}

gameFoundSound();

字符串
大家好,我在这里分享我的代码,我想播放声音时,我的弹出窗口出现在那里,没有用户交互,但在浏览器得到警告-AudioContext不允许启动。它必须恢复(或创建)后,在页面上的用户手势,并得到错误-未捕获TypeError:Cannot read property 'play' of undefined
我怎样才能播放背景音乐,请帮助我。

qmb5sa22

qmb5sa221#

这对你来说可能太晚了,但如果有人来这里寻求解决方案...
这是因为现代的浏览器策略不允许在没有用户手势的情况下播放音频。实际上,这意味着浏览器不会播放您的音频,直到您在画布内移动,点击或点击。这样做的目的是为了防止烦人的视听垃圾,我们经常处理这些天,从技术上讲,任何音频播放现在都需要用户输入才能开始。

所有必要的信息都可以在这里找到:https://p5js.org/reference/#/p5/userStartAudio

基本上,你只需要做两件小事:
1.在setup()内部调用getAudioContext().suspend();,然后再调用任何其他音频代码。
1.然后在mousePressed()中调用userStartAudio();或任何类似的用户手势函数。
就我个人而言,我已经这样做了(其他东西删除),所以它不会无缘无故地重复调用:

let audioStarted = false;

function setup() {
    // Suspend audio until user gesture
    getAudioContext().suspend();

    // Initialize audio
    sound = new p5.Oscillator(); // etc...
}

function mousePressed() {
    // Start audio on user gesture
    if (!audioStarted) {
        userStartAudio();
        audioStarted = true;
    }
}

字符串

lvjbypge

lvjbypge2#

你打电话给function preload了吗
gameFound是undefined

qgelzfjb

qgelzfjb3#

您必须在函数setup()中调用gameFoundSound()。Uncaught TypeError: Cannot read property 'play' of undefined发生在声音(在本例中为gameFound)未准备好时。在函数preload()中调用loadSound()确保声音在函数setup()和draw()之前加载。另一种方法是在函数preload()之外调用loadSound()时使用它的回调。更多信息。文档:https://p5js.org/reference/#/p5/loadSound。

相关问题