Audio HTML

Elemento HTML

El audio HTML es un tema de la especificación HTML , que incorpora entrada, reproducción y síntesis de audio, así como conversión de voz a texto , todo en el navegador.

Elemento

El <audio>elemento representa un sonido o una secuencia de audio. Se utiliza habitualmente para reproducir un único archivo de audio dentro de una página web, mostrando un widget de interfaz gráfica de usuario con controles de reproducción/pausa/volumen.

El <audio>elemento tiene estos atributos:

• atributos globales (tecla de acceso; clase; contenteditable; menú contextual; directorio; arrastrable; zona de colocación; oculto; id; idioma; corrector ortográfico; estilo; índice de tabulación; título; traducir)
• autoplay = "autoplay" o "" (cadena vacía) o vacío
  Indica al agente de usuario que comience automáticamente la reproducción de la transmisión de audio tan pronto como pueda hacerlo sin detenerse.
• preload = "none" o "metadata" o "auto" o "" (cadena vacía) o vacío
  Representa una pista para el agente de usuario sobre si vale la pena realizar una descarga optimista de la transmisión de audio en sí o de sus metadatos.
  • "ninguno": indica al agente de usuario que no se espera que el usuario necesite la transmisión de audio o que es deseable minimizar el tráfico innecesario.
  • "metadatos": indica al agente de usuario que no se espera que el usuario necesite la transmisión de audio, pero que es conveniente obtener sus metadatos (duración, etc.).
  • "auto": indica al agente de usuario que, de manera optimista, se considera deseable descargar todo el flujo de audio.
• controles = "controles" o "" (cadena vacía) o vacío
  Indica al agente de usuario que exponga una interfaz de usuario para controlar la reproducción de la transmisión de audio.
• loop = "loop" o "" (cadena vacía) o vacío
  Indica al agente de usuario que busque nuevamente el inicio de la transmisión de audio al llegar al final.
• mediagroup = string
  Indica al agente de usuario que vincule varios vídeos y/o transmisiones de audio entre sí.
• muted = "silenciado" o "" (cadena vacía) o vacío
  Representa el estado predeterminado de la transmisión de audio, anulando potencialmente las preferencias del usuario.
• src = no vacío [URL] potencialmente rodeado de espacios
  La URL para la transmisión de audio.

Ejemplo:

Navegadores compatibles

En PC:

• Google Chrome
• Internet Explorer 9
• Firefox 3.5
• Opera 10.5
• Safari 3.1

En dispositivos móviles:

• Navegador Android 2.3
• Google Chrome
• Internet Explorer Móvil 9
• Safari 4
• Firefox
• Opera Mobile 11

Formatos de codificación de audio admitidos

La adopción del audio HTML, al igual que la del vídeo HTML , se ha polarizado entre los defensores de los formatos libres y los que están sujetos a patentes . En 2007, el W3C retiró de la especificación HTML5 la recomendación de utilizar Vorbis junto con la de utilizar Ogg Theora , citando la falta de un formato aceptado por todos los principales proveedores de navegadores.

Apple y Microsoft admiten los formatos AAC definidos por ISO / IEC y el antiguo MP3 . Mozilla y Opera admiten el formato libre y abierto Vorbis en los contenedores Ogg y WebM , y critican la naturaleza de patentes de MP3 y AAC, que se garantiza que "no son libres". Google ha proporcionado hasta ahora soporte para todos los formatos comunes.

La mayoría de los archivos AAC con una longitud finita se envuelven en un contenedor MPEG-4 (.mp4, .m4a), que es compatible de forma nativa con Internet Explorer, Safari y Chrome, y con el sistema operativo Firefox y Opera. ^{[ cita requerida ]} La mayoría de las transmisiones en vivo AAC con una longitud infinita se envuelven en un contenedor de transmisión de transporte de datos de audio (.aac, .adts), que es compatible con Chrome, Safari, Firefox y Edge. ^{[1] [2] [3]}

Muchos navegadores también admiten audio PCM sin comprimir en un contenedor WAV E. ^[4]

En 2012, el formato Opus, libre de regalías y abierto, fue publicado y estandarizado por IETF . Es compatible con Mozilla, Google, Opera y Edge. ^{[4] [5] [6] [7]}

Esta tabla documenta el soporte actual de los formatos de codificación de audio por <audio>elemento.

API de audio web y API de procesamiento de MediaStream

La especificación Web Audio API desarrollada por W3C describe una API de JavaScript de alto nivel para procesar y sintetizar audio en aplicaciones web. El paradigma principal es el de un gráfico de enrutamiento de audio, donde una serie de objetos AudioNode están conectados entre sí para definir la representación general del audio. El procesamiento real se llevará a cabo principalmente en la implementación subyacente (normalmente código optimizado en Assembly/C/C++), pero también se admite el procesamiento y la síntesis directos en JavaScript. ^[27]

El navegador Firefox de Mozilla implementa una extensión Audio Data API similar desde la versión 4, implementada en 2010 ^[28] y lanzada en 2011, pero Mozilla advierte que no es estándar y está obsoleta, y recomienda la Web Audio API en su lugar. ^[29] Algunas bibliotecas de síntesis y procesamiento de audio de JavaScript como Audiolet Archivado el 28 de enero de 2013 en Wayback Machine admiten ambas API.

El Grupo de Trabajo de Audio del W3C también está considerando la especificación de la API de procesamiento MediaStream desarrollada por Mozilla . ^[30] Además de la mezcla y procesamiento de audio, cubre la transmisión de medios más general, incluida la sincronización con elementos HTML, la captura de transmisiones de audio y video y el enrutamiento peer-to-peer de dichas transmisiones de medios. ^[31]

Navegadores compatibles

En PC:

• Google Chrome 10 ^[32] (Habilitado por defecto desde 14 ^[33] )
• Firefox 23 (habilitado por defecto desde 25)
• Ópera 15
• Safari 6
• Microsoft Edge 12
• Opera GX 36

En dispositivos móviles:

• Google Chrome para Android 28 (habilitado de forma predeterminada desde 29) y iPads de Apple
• Safari 6 (tiene restricciones de uso (silenciado a menos que el usuario lo llame))
• Firefox 23 (habilitado por defecto desde 25)
• Tizen

API de voz web

La API de Web Speech tiene como objetivo proporcionar un método de entrada alternativo para aplicaciones web (sin utilizar un teclado). Con esta API, los desarrolladores pueden dar a las aplicaciones web la capacidad de transcribir voz a texto, desde el micrófono de la computadora. El audio grabado se envía a servidores de voz para su transcripción, después de lo cual el texto se escribe para el usuario. La API en sí es independiente de la implementación de reconocimiento de voz subyacente y puede admitir tanto reconocedores basados ​​en servidor como integrados. ^[34] El grupo HTML Speech Incubator ha propuesto la implementación de tecnología de audio y voz en navegadores en forma de API uniformes y multiplataforma. La API contiene tanto: ^[35]

• API de entrada de voz
• API de texto a voz

Google integró esta función en Google Chrome en marzo de 2011. ^[36] Permitiendo a sus usuarios buscar en la web con su voz con un código como el siguiente:

Navegadores compatibles

• Safari 14.1 y versiones posteriores ^[37]
• Google Chrome 25 y versiones posteriores
• Firefox Desktop 44.0 y posteriores (Linux y Mac) / 45.0 y posteriores (Windows) [PARCIAL: solo síntesis de voz; sin reconocimiento; habilitado de manera predeterminada desde 49.0] ^{[38] [39]}

Véase también

• Vídeo HTML
• Uso de formatos Ogg en HTML5

Notas

1. No hay soporte nativo para el códec AAC debido a razones de licencia. La decodificación de archivos de audio requiere que el sistema operativo anfitrión proporcione una biblioteca compatible. ^[10]
2. Un archivo MPEG-4 contiene un encabezado que incluye metadatos seguidos de "pistas" que pueden incluir datos de video y audio, por ejemplo, video codificado H.264 y audio codificado AAC. ADTS, en cambio, es un formato de transmisión que consta de una serie de cuadros, cada uno de los cuales tiene un encabezado seguido de los datos AAC. ^[2]

Referencias

1. "Contenedor MP4 · Número 95 · karlheyes/icecast-kh". GitHub . Consultado el 18 de noviembre de 2022 .
2. "Nota técnica TN2236: Codificación de audio avanzada de alta eficiencia (HE-AAC)".
3. "1224887 – Implementar el cliente de decodificación de audio OpenMax IL AAC".
4. "Guía de formatos y tipos de medios: contenido de imagen, audio y video – Tecnologías de medios web | MDN". developer.mozilla.org .
5. "11 de septiembre de 2012: el códec de audio Opus ahora es RFC6716, se publica la fuente de referencia Opus 1.0.1".
6. "¡Es Opus, es genial y ahora es un estándar de códec de audio! – Mozilla Hacks – el blog para desarrolladores web".
7. "Compatibilidad con WebM, VP9 y Opus en Microsoft Edge – Blog de desarrollo de Microsoft EdgeBlog de desarrollo de Microsoft Edge". blogs.windows.com . 18 de abril de 2016 . Consultado el 22 de marzo de 2017 .
8. "Habilitar compatibilidad con mp3 en Chromium". Google . Consultado el 1 de mayo de 2018 .
9. "Notas de la versión de Firefox 71.0". Mozilla. 3 de diciembre de 2019.
10. "Guía de formatos y tipos de medios: contenido de imagen, audio y vídeo". Red de desarrolladores de Mozilla . Mozilla . Consultado el 6 de diciembre de 2019 .
11. "1190341 - el audio/aacp Shoutcast no es compatible".
12. "1169212 - Crear ADTSDemuxer, un MediaDataDemuxer".
13. "Estado de la plataforma: desarrollador de Microsoft Edge".
14. "Presentación del paquete de extensión de medios web con compatibilidad con OGG Vorbis y Theora para Microsoft Edge". Blog de desarrollo de Microsoft Edge . Microsoft . 5 de diciembre de 2017.
15. "Notas de Firefox - Escritorio".
16. "Notas de Firefox - Escritorio".
17. "Estado de la plataforma: desarrollador de Microsoft Edge". developer.microsoft.com .
18. "Notas de Firefox - Escritorio".
19. "Firefox 28.0, ver todas las nuevas funciones, actualizaciones y correcciones".
20. Simmons, Jen (26 de octubre de 2021). "Nuevas funciones de WebKit en Safari 15".
21. "Documentación para desarrolladores de Apple". developer.apple.com .
22. "Compatibilidad de códecs FLAC para <audio> y WebAudio". Estado de la plataforma Chrome . Consultado el 27 de diciembre de 2016 .
23. "Estado de la plataforma: desarrollador de Microsoft Edge". developer.microsoft.com .
24. "Firefox 51 para desarrolladores". Red de desarrolladores de Mozilla . Consultado el 27 de diciembre de 2016 .
25. Chaim Gartenberg (6 de junio de 2017). "Según se informa, Apple agrega compatibilidad con audio FLAC sin pérdida en iOS 11". The Verge .
26. "Estado de la plataforma: desarrollador de Microsoft Edge".
27. Chris Rogers (15 de marzo de 2012). "Web Audio API". W3C . Archivado desde el original el 20 de julio de 2012. Consultado el 4 de julio de 2012 .{{cite web}}: CS1 maint: bot: estado de URL original desconocido ( enlace )
28. "API de datos de audio".
29. "Presentación de la extensión Audio API". Mozilla Developer Network . Mozilla . 2012-03-05. Archivado desde el original el 2012-05-05 . Consultado el 2012-07-04 .
30. "API de procesamiento de audio". W3C . 15 de diciembre de 2011. Archivado desde el original el 14 de junio de 2012. Consultado el 4 de julio de 2012 .{{cite web}}: CS1 maint: bot: estado de URL original desconocido ( enlace )
31. Robert O'Callahan (31 de mayo de 2012). "MediaStream Processing API". W3C . Consultado el 4 de julio de 2012 .
32. "Web Audio API ya está disponible en Chrome de Chris Rogers el 1 de febrero de 2011 ([email protected] desde febrero de 2011)". lists.w3.org . Consultado el 18 de noviembre de 2022 .
33. Scott Gilbertson (19 de septiembre de 2011). "Chrome 14 agrega mejor audio y compatibilidad con 'cliente nativo'". Webmonkey . Wired . Consultado el 4 de julio de 2012 .
34. "Borrador de API" . Consultado el 28 de enero de 2012 .
35. "HTML5 Speech API" . Consultado el 28 de enero de 2012 .
36. "Hablando con tu computadora" . Consultado el 28 de enero de 2012 .
37. "Web Speech API – Web APIs | MDN" . Consultado el 20 de mayo de 2024 .
38. "Firefox 49 para desarrolladores – Mozilla | MDN" . Consultado el 20 de mayo de 2024 .
39. "Web Speech API – Web APIs | MDN" . Consultado el 20 de mayo de 2024 .

Enlaces externos

• HTML/Elementos/audio – Wiki del W3C
• Elemento de audio HTML5 – W3C
• API de audio web – W3C
• API de procesamiento de MediaStream – W3C
• API de voz web – W3C
• DAW de audio web – GitHub
• API de audio web de Mozilla