Nos últimos meses, a API Web Audio do WebKit se tornou uma plataforma atraente para jogos e aplicativos de áudio na Web. À medida que os desenvolvedores se familiarizam com ele, ouço perguntas semelhantes repetidamente. Esta atualização rápida é uma tentativa de responder a algumas das perguntas mais frequentes para tornar sua experiência com a API Web Audio mais agradável.
P: Ajuda, não consigo fazer sons!
R: Se você não conhece a API Web Audio, consulte o tutorial de início ou a receita do Eric para reproduzir áudio com base na interação do usuário.
P: Quantos contextos de áudio devo ter?
A: Geralmente, é necessário incluir uma AudioContext por página, e um único contexto de áudio pode oferecer suporte a muitos nós conectados a ele. Embora seja possível incluir vários AudioContexts em uma única página, isso pode afetar a performance.
P: Tenho um AudioBufferSourceNode, que acabei de reproduzir com noteOn(), e quero reproduzir novamente, mas noteOn() não faz nada. Preciso de ajuda!
A: Quando um nó de origem termina a reprodução, ele não pode ser reproduzido novamente. Para reproduzir o buffer novamente, crie um novo AudioBufferSourceNode e chame noteOn().
Embora a recriação do nó de origem possa parecer ineficiente, os nós de origem são altamente otimizados para esse padrão. Além disso, se você mantiver um identificador para o AudioBuffer, não será necessário fazer outra solicitação ao recurso para tocar o mesmo som novamente. Se você precisar repetir esse padrão, encapsule a reprodução com uma função auxiliar simples, como playSound(buffer).
P: Ao reproduzir um som, por que você precisa criar um novo nó de origem toda vez?
A: A ideia dessa arquitetura é separar o recurso de áudio do estado de reprodução. Usando uma analogia de toca-discos, os buffers são análogos a discos e as fontes são análogas a cabeças de reprodução. Esse padrão é essencial porque muitos aplicativos envolvem várias versões do mesmo buffer sendo reproduzidas simultaneamente.
P: Como posso processar o som das tags audio e video?
A: MediaElementAudioSourceNode está em desenvolvimento. Quando disponível, ele vai funcionar mais ou menos assim (adicionando um efeito de filtro a uma amostra reproduzida pela tag de áudio):
<audio src="sounds/sample.wav" controls>
var audioElement = document.querySelector('audio');
var mediaSourceNode = context.createMediaElementSource(audioElement);
mediaSourceNode.connect(filter);
filter.connect(context.destination);
Esse recurso é acompanhado em este crbug. Nesta configuração, não é necessário chamar mediaSourceNode.noteOn(), a tag de áudio controla a reprodução.
P: Quando posso receber som de um microfone?
A: A parte de entrada de áudio será implementada como parte do WebRTC usando getUserMedia e estará disponível como um nó de origem especial na API Web Audio. Ele vai funcionar em conjunto com createMediaElementSource.
P: Como posso verificar quando um AudioSourceNode terminou de ser reproduzido?
A: No momento, é necessário usar um timer JavaScript, já que a API Web Audio não oferece suporte a essa funcionalidade. O snippet a seguir do tutorial "Como começar a usar a API Web Audio" é um exemplo disso em ação:
// Assume source and buffer are previously defined.
source.noteOn(0);
var timer = setTimeout(function() {
console.log('playback finished');
}, buffer.duration * 1000);
Há um bug aberto para fazer com que a API Web Audio implemente um callback mais preciso.
P: O carregamento de sons faz com que toda a linha de execução da interface fique bloqueada e a interface não responda. Ajuda!**
A: Use a API decodeAudioData para carregamento assíncrono para evitar o bloqueio da linha de execução principal. Confira este exemplo.
P: A API Web Audio pode ser usada para processar sons mais rápido do que em tempo real?
A: Sim, estamos trabalhando em uma solução. Fique ligado!
P: Fiz um aplicativo incrível da API Web Audio, mas sempre que a guia em que ele está sendo executado vai para o segundo plano, os sons ficam estranhos.
A: Provavelmente, isso ocorre porque você está usando setTimeouts, que se comporta de maneira diferente se a página estiver em segundo plano. No futuro, a API Web Audio vai poder fazer callbacks em momentos específicos usando o timer interno do áudio da Web (atributo context.currentTime). Para mais informações, consulte esta solicitação de recurso.
Em geral, é recomendável interromper a reprodução quando o app for para o segundo plano. É possível detectar quando uma página vai para o segundo plano usando a API Page Visibility.
P: Como posso mudar o tom de um som usando a API Web Audio?
A: Mude o playbackRate no nó de origem.
P: Posso mudar o tom sem mudar a velocidade?
A: A API Web Audio pode ter um PitchNode no contexto de áudio, mas isso é difícil de implementar. Isso ocorre porque não há um algoritmo simples de mudança de tom na comunidade de áudio. Técnicas conhecidas criam artefatos, especialmente nos casos em que o deslocamento de tom é grande. Há dois tipos de abordagem para resolver esse problema:
- Algoritmos de domínio de tempo, que causam artefatos de eco de segmento repetido.
- Técnicas de domínio de frequência, que causam artefatos de som reverberante.
Embora não haja um nó nativo para fazer essas técnicas, é possível fazer isso com um JavaScriptAudioNode. Este snippet de código pode servir como ponto de partida.
P: Como posso criar um AudioContext com a taxa de amostragem que eu quiser?
R: No momento, não há suporte para isso, mas estamos analisando a situação. Consulte esta solicitação de recurso.
Se tiver outras dúvidas, faça perguntas no StackOverflow usando a tag web-audio.