Estoy creando un sitio web que reproduce audio mp3 y luego se desvanece después de X segundos. Tuve este trabajo usando una implementación de etiqueta de audio normal manipulando el volumen en un intervalo, pero esta solución no funciona en iOS porque el volumen es una propiedad de solo lectura. Descubrí que esto se podía lograr usando la API de AudioContext, pero que necesitaría usar webkitAudioContext para Safari/iOS.

Implementé una solución usando context.createMediaElementSource pero el tono de audio está por todas partes. Cuando el audio comienza a reproducirse por primera vez, se eleva durante unos segundos, y también cuando minimizas la aplicación y la vuelves a abrir, volverá a subir. Supongo que tiene algo que ver con la desalineación del reloj interno, por lo que la reproducción se acelera para adaptarse, pero de cualquier manera, la aplicación simplemente no se puede usar con este problema.

He encontrado discusiones sobre otros problemas de distorsión/zumbidos relacionados con esta API en iOS, pero no se mencionan los problemas de tono. Encontré un envío de respuesta aquí que se vincula a un jsfiddle que exhibe exactamente los mismos problemas de tono de audio.

Probé una implementación usando createBufferSource en lugar de createMediaElementSource que en realidad resuelve el problema, pero administrar el audio usando esa API (verificar/establecer la posición actual, verificar/establecer el estado de pausa/reproducción/detención, etc.) parece imposible.

Creé una demostración de CodeSandbox y también subí un video para demostrarlo y puedes escuchar que el cambio de tono es extremadamente obvio. ¿Alguien sabe qué tan consistente se reproducirá esto en los dispositivos iOS (me imagino, muy consistente) y alguien puede sugerir una solución/solución alternativa?