¡Resuelto! con INFORMACIÓN crítica AÑADIDA:
Descubrí que la causa es encontrar el sonido cuando se usa js , en lugar de html (¡que sí funciona!).
FINALMENTE arregló la ruta correcta ...
/* Correct PATH: games Game_1 Game_1_Support audio applause.mp3 js PlaySound.js */ PlaySound("Game_1_Support/audio/applause.mp3"); function PlaySound(id, src) { var theSound = new Audio(); theSound.src = src; alert(src); theSound.play(); }¡Gracias! absolutamente todos!
FINALIZAR INFORMACIÓN AÑADIDA
¿Reproducir sonido sin interacción de clic dentro de JS no funciona?
Tema muy antiguo basado en mi investigación y esta investigación establece que el usuario debe interactuar haciendo clic, por ejemplo, para que el sonido se reproduzca a través de:
var theSound = new Audio(srcString); theSound.play(); En el juego que estoy desarrollando actualmente, al hacer clic en <a> , el sonido se reproduce.
Pero... mi juego también tiene una bola que se mueve por el interior de la ventana y si la bola golpea cualquiera de los lados de la ventana, quiero que se reproduzca un sonido.
No hay que hacer clic , solo mover la bola con ciertas teclas, por ejemplo, "r" y "l".
Entonces, ¿cómo hago esto dentro de JS sin hacer clic ?
verifique este ejemplo, use el evento canplay, luego inicie su juego, luego dentro del evento simplemente llame al método play (), observe que si nunca enfoca la ventana, el sonido nunca se reproducirá, si tiene problemas para iniciar el sonido después de un evento confiable necesita ser despedido, podría usar un truco, poner un evento de clic en su documento;
document.addEventListener("click",()=>{ sound.volume = 0; sound.play(); sound.pause(); sound.volume = 1; sound.currentTime = 0; // here remove your listener to avoid multiple calls }); <html> <body> <div style="width:300px;height:300px;border:1px solid;position:relative;"> <div id="ball" style="width:10px;height:10px;background-color:blue;position:absolute;top:100px;"> </div> </div> <script> let sound= new Audio("https://actions.google.com/sounds/v1/alarms/beep_short.ogg"); sound.oncanplay = function(){ let ball = document.getElementById("ball"); let i = 0; setInterval(()=>{ i= i+10; ball.style.left = i+"px"; if(i>280){ i=0; sound.play(); } },200); }; </script> </body> </html>No necesariamente necesita un evento de click . Solo necesitas un evento de confianza. Un evento de keypress de tecla es lo suficientemente bueno para iniciar el audio.
Ahora que se trata de un juego, es importante que todos los activos (audio, imágenes, guiones) estén cargados y listos antes de que se inicie el juego. Nunca cree un nuevo objeto de audio y luego llame a play() inmediatamente después. Debe esperar hasta que se cargue el archivo o hasta que el archivo pueda reproducirse (en el caso de audio y video).
En el ejemplo, he creado una función loadaudio() que devuelve una promesa de un objeto de audio. Si hay muchos activos como este, deben ir a la matriz y cuando todos estén resueltos, el juego puede comenzar.
Luego está el problema con la interacción del usuario (problema descrito aquí: https://stackoverflow.com/a/62720714/322084 ). Hice un botón que cuando se hace clic inicia el juego. Después de que el usuario haya hecho clic en el botón, cualquier elemento de audio puede reproducirse en cualquier momento.
var globalassets = []; const loadaudio = (id, src) => { return new Promise((resolve, reject) => { let audio = new Audio(); audio.id = id; audio.oncanplay = resolve(audio); audio.onerror = reject(audio); audio.src = src; }); }; const initgame = assets => { globalassets = assets; console.log('initiate game'); document.getElementById('start').classList.remove('hidden'); }; const onstatbtn = e => { console.log('game is playing'); globalassets.find(asset => asset.id = 'a1').play(); }; document.addEventListener('DOMContentLoaded', e => { let assets = [ loadaudio('a1','https://upload.wikimedia.org/wikipedia/commons/6/61/Wellerman.wav') ]; Promise.all(assets).then(initgame); document.getElementById('start').addEventListener('click', onstatbtn); }); .hidden { display: none; } <button id="start">Start game</button>