Estoy tratando de saber cuándo sale realmente el sonido de los altavoces del usuario, si eso tiene algún sentido.
tengo lo siguiente:
const stream = new Audio("https://stream1.srvnetplus.com:18122/stream"); const loading = false; async function play() { loading = true; // stream.play() returns a Promise<void> await stream.play(); loading = false; } loading está configurado como falso, pero por alguna razón, el sonido real sale de mis parlantes después de 1 a 2 segundos en algunas ocasiones.
Esta biblioteca de reacción (react-audio-player) tiene un evento llamado onCanPlay . Según el estado de los documentos:
| Evento | Escribe | Descripción |
|---|---|---|
| onCanPlay | Función | se llama cuando se ha descargado suficiente archivo para poder comenzar a jugar. Pasó el evento. |
Esto me hace pensar que await in await stream.play(); no es suficiente saber cuándo se está reproduciendo el audio real. Corrígeme si me equivoco.
Me gustaría una solución que se vea así:
const stream = new Audio("https://stream1.srvnetplus.com:18122/stream"); const loading = false; async function play() { loading = true; const res = await stream.play(); await res.ready(); loading = false; }Resuelto mi problema con howler.js
import { Howl } from "howler"; const streamUrl = "https://stream1.srvnetplus.com:18122/stream"; const stream = new Howl({ src: [streamUrl], html5: true, preload: true, }); const loading = false; function play() { loading = true; stream.play(); stream.on("play", () => { loading = false; }); }Todos los eventos de <audio> podrían registrarse y mostrarse en el siguiente ejemplo. El evento de playing se activa después de que comienza la reproducción de audio.
function initPlayback() { const audio = document.querySelector('audio') event.target.remove() // remove <button> audio.hidden = false; // log all events of <audio>, except timeupdate (too verbose) ['audioprocess', 'canplay', 'canplaythrough', 'complete', 'durationchange', 'emptied', 'ended', 'loadeddata', 'loadedmetadata', 'pause', 'play', 'playing', 'ratechange', 'seeked', 'seeking', 'stalled', 'suspend', // 'timeupdate' 'volumechange', 'waiting'] .forEach(name => audio.addEventListener(name, event => { console.log(name) })) audio.src = 'https://stream1.srvnetplus.com:18122/stream' audio.play() .then(() => console.log('play() resolved')) } <audio controls hidden></audio> <button onclick="initPlayback()" style="padding: 1em 2em;">Play</button>