Create download link to an audio recording

Asked

Viewed 1,092 times

3

I caught a net example in Javascript that captures audio from the device and with a button on the page it is possible to record audio and export it:

In this code follows we have the buttons:

<button onclick="startRecording(this);">record</button>
<button onclick="stopRecording(this);" disabled>stop</button>

From them will command to startRecording to start recording

function startRecording(button) {
    recorder && recorder.record();
    button.disabled = true;
    button.nextElementSibling.disabled = false;
    __log('Recording...');
}

and stopRecording to stop recording

function stopRecording(button) {
    recorder && recorder.stop();
    button.disabled = true;
    button.previousElementSibling.disabled = false;
    __log('Stopped recording.');

    // create WAV download link using audio data blob
    createDownloadLink();
    //recorder.clear();
  }

In this Function has a call to the function createDownloadLink() that as far as I understood should create a link to download the previously recorded audio and that’s the problem, the link is not creating.

function createDownloadLink() {
  recorder && recorder.exportWAV(function (blob) {
      var url = URL.createObjectURL(blob);
      var li = document.createElement('li');
      var au = document.createElement('audio');
      var hf = document.createElement('a');

      au.controls = true;
      au.src = url;
      hf.href = url;
      hf.download = new Date().toISOString() + '.wav';
      hf.innerHTML = hf.download;
      li.appendChild(au);
      li.appendChild(hf);
      recordingslist.appendChild(li);
  });
}

How to enable the link to download the audio when you click Stop?

  • you already have the Base64 of the generated file?

  • I don’t have, how it would be and what it’s for?

  • What is the value of var url? Do you already have it? If you have just create a tag to download.

  • I debugged now and when it arrives at stopRecording / createDownloadLink();' nor does it enter 'Function createDownloadLink()'. but I put the mouse over the URL.cre... and the path "http://localhost:59564/example_simple_exportwav.html" appears and the result of this error link: Most likely causes: * The specified directory or file does not exist on the Web server. * The URL contains a typographical error. * A custom filter or module, such as Scan URL, restricts access to the file.

1 answer

2


This repository is really missing some files, and it would not be feasible to put it here. The complete repository you can find on this github.

And the complete tutorial on how to use, you will see here.

Source: Nusofthq / Audioec.

Using Chrome 46 did not work on my computer. But firefox 42 works normally.

  • perfect, thank you so much for your help.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.