tutoriais mais recente desenvolvimento web

HTML5 áudio


HTML5 fornece um padrão para a reprodução de arquivos de áudio.

HTML5 áudio é um assunto da especificação HTML5, incorporando entrada de áudio, reprodução e síntese, bem como o discurso ao texto, no navegador.


Áudio na Web

Antes HTML5, não havia nenhum padrão para reproduzir arquivos de áudio em uma página web.

Antes HTML5, arquivos de áudio só poderia ser jogado com um plug-in (like flash) .

O HTML5 <audio> elemento especifica uma forma padrão para incorporar áudio em uma página web.


Suporte navegador

Os números na tabela especificar a primeira versão do navegador que suporta plenamente o <audio> elemento.

Elemento
<audio> 4.0 9 3,5 4.0 10,5

O HTML <audio> Elemento

Para reproduzir um arquivo de áudio em HTML, use o <audio> elemento:

Exemplo

<audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Tente você mesmo "

O <audio> elemento representa um som, ou um fluxo de áudio. É comumente utilizada para reproduzir um único arquivo de áudio dentro de uma página web, mostrando um widget de GUI com controles de play / pause / volume.

O <audio> elemento tem esses atributos:

atributos globais (accesskey; classe; contenteditable; contextmenu; dir; draggable; dropzone; escondido; id; lang; verificação ortográfica; estilo; tabindex; título; traduzir)

autoplay = "autoplay" ou "" (string vazia) ou vazio Instrui o User-Agent para iniciar automaticamente a reprodução do fluxo de áudio assim que ele pode fazê-lo sem parar.

pré-carga = "none" ou "metadados" ou "auto" ou "" (string vazia) ou vazio Representa uma dica para o User-Agent sobre se otimista descarga do próprio ou de seus metadados fluxo de áudio é considerado vale a pena.

"None": Dicas para o User-Agent que o usuário não se espera que precisa o fluxo de áudio, ou que minimizando o tráfego desnecessário é desejável.

"Metadados": Dicas para o User-Agent que o usuário não se espera que precisa o fluxo de áudio, mas que buscar seus metadados (duração e assim por diante) é desejável.

"Auto": Dicas para o User-Agent que otimista download de todo o fluxo de áudio é considerado desejável.

controles = "controles" ou "" (string vazia) ou vazio Instrui o User-Agent para expor uma interface de usuário para controlar a reprodução do fluxo de áudio.

loop = "laço" ou "" (string vazia) ou vazio Instrui o User-Agent para buscar de volta para o início da transmissão de áudio ao chegar ao fim. MediaGroup = string Instrui o User-Agent para ligar vários vídeos e / ou fluxos de áudio juntos.

silenciado = ou "" (string vazia) "silenciado" ou vazio Representa o estado padrão do fluxo de áudio, potencialmente substituindo as preferências do usuário. src = não-vazia [URL] potencialmente rodeado por espaços O URL para o fluxo de áudio.


Áudio HTML - Como Funciona

Os controls atribuir adiciona controles de áudio, como play, pause e volume.

Texto entre o <audio> e </audio> tag será exibido em navegadores que não suportam o <audio> elemento.

Vários <source> elementos podem conectar-se a diferentes arquivos de áudio. O navegador irá usar o primeiro formato reconhecido.


Áudio HTML - Suporte a navegadores

Atualmente, existem 3 formatos de arquivos suportados para o <audio> elemento: MP3, WAV e Ogg:

navegador MP3 Wav Ogg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES YES YES
Safari YES YES NO
Opera YES YES YES

Áudio HTML - Tipos de Mídia

Formato de arquivo Tipo de mídia
MP3 audio/mpeg
Ogg audio/ogg
Wav audio/wav

Áudio HTML - métodos, propriedades e eventos

HTML5 define métodos DOM, propriedades e eventos para o <audio> elemento.

Isso permite que você carregar, reproduzir e pausar áudios, bem como duração definida e volume.

Há também eventos DOM que pode notificá-lo quando um áudio começa a tocar, está em pausa, etc.

Para uma referência DOM completa, vá ao nosso HTML5 Audio / Video DOM Referência .


HTML5 Audio Tags

etiqueta Descrição
<audio> Define o conteúdo de som
<source> Define vários recursos de mídia para os elementos de mídia, como <video> e <audio>

HTML de áudio - Speech API Web

A API Speech Web visa proporcionar um método de entrada alternativa para aplicações web (sem usar um teclado). Com esta API, os desenvolvedores podem dar web aplicativos a capacidade de transcrever voz para texto, do microfone do computador. O áudio gravado é enviado para servidores de voz para transcrição, após o qual o texto é digitado para fora para o usuário. A API em si é agnóstico da implementação de reconhecimento de voz subjacente e pode apoiar tanto servidor com base, bem como reconhecedores embutidos. O grupo HTML Speech Incubator propôs a implementação da tecnologia de áudio-speech em navegadores na forma de APIs uniforme, multi-plataforma. A API contém:

  • Speech API Input
  • Text to Speech API