1

Como faço para conectar a entrada de audio vinda do microfone ao analyser da API AudioContext para obter a frequencia em Hertz?

Javascript:

let display = document.getElementById("display");
let ctx = new AudioContext();
var analyser = ctx.createAnalyser();
analyser.connect(ctx.destination);

navigator.mediaDevices
    /* Solicita permissão de acesso */
    .getUserMedia({ audio: { echoCancellation: true } })
    /* Cria um fonte de stream */
    .then(stream => {
        let source = ctx.createMediaStreamSource(stream);
        source.connect(analyser);
        display.innerText = analyser.getFloatFrequencyData()[0];
    })
    .catch(err => {
        console.log("Microfone negado");
    });

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>API JS</title>
</head>
<body>
    <!-- <audio id="playerAudio" src="" autoplay controls></audio> -->
    <p id="display">0</p>
    <script src="/script.js"></script>
</body>
</html>

Não estou conseguindo fazer essa obra, se eu conectar a variavel stream do then() diretamente a um objeto de audio (com controle de bausa e mute...) consigo ouvir ao mesmo tempo que gravo, porém não consigo interceptar com o analyser para obter os Hertz o audio.

1 Resposta 1

0

Dá para ligar um Analyser e um ScriptProcessor.

var display = document.getElementById("display");

navigator.mediaDevices.getUserMedia({audio: true})
.then(function(stream) {
    var ctx = new AudioContext();
    /* Cria um fonte de stream */
    var source = ctx.createMediaStreamSource(stream);
    var analyser = ctx.createAnalyser();
    var processor = ctx.createScriptProcessor(256, 1, 1);
    source.connect(processor);
    source.connect(analyser);
    processor.connect(ctx.destination);

    processor.onaudioprocess = (data) => {
        var dataArray = new Float32Array(analyser.frequencyBinCount);

        setInterval(() => {
            analyser.getFloatFrequencyData(dataArray);
            display.innerHTML = dataArray;
        }, 1000);
    }


})
.catch(err => {
  console.log(err.message);
});

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .