Javascript audio recording

Is this possible in jQuery or javascript, without using libraries to record sound for X seconds and save to an audio file. I looked at getUserMedia, I see that it can extract audio and video from a webcam. I am currently using a webcam with a different library: Clmtracker , and for this reason I would like to try and do it without any external libraries.

I want to save the recorded audio in a div. I am currently taking a picture and giving it a unique name, so I am wondering how I can capture a short section of audio and save it in the same div created.

Question: How can I get audio in 5 seconds from a webcam? Sub-Question: How can I save this in an element in a div?

My code to capture Img and data on my page

function capturePage() { var now = new Date(); if (nextAllowedCapture <= now) { // Do capture logic audioElement.play(); counting++ console.log("Capturing..."); $(".capturing").show().delay(500).fadeOut(3000); var innerDiv = document.createElement('div'), innerDivImg = document.createElement('canvas'), image = document.createElement('img'), ul = document.createElement('ul'); innerDiv.className = 'divCreate'; innerDiv.id = 'img' + counting; innerDivImg.height = 450; innerDivImg.width = 600; innerDivImg.getContext('2d').drawImage(vid, 0, 0); image.id = 'image' + counting; image.src = innerDivImg.toDataURL(); image.className = 'divCreateImg'; innerDiv.appendChild(image); innerDiv.appendChild(ul); document.getElementById('galleryWrapper').appendChild(innerDiv); $('#measurements h4').each(function () { $("#" + innerDiv.id + " " + 'ul').append('<li>' + $(this).text() + ': ' + $(this).next().text()); }); nextAllowedCapture = new Date(); nextAllowedCapture.setSeconds(nextAllowedCapture.getSeconds() + coolDownSeconds); } else { nextCapTime = (nextAllowedCapture.getTime() - now.getTime()) / 1000; console.log("Can't capture again yet. This function can be executed again in " + (nextAllowedCapture.getTime() - now.getTime()) / 1000 + " seconds."); } } 
+6
source share
1 answer

You can see the code for Recorder.js as an example that implements the audio capture function and saves it in wav format using getUserMedia annd yes, only html5 and javascript.

Now you can say that you asked without any plugins. In fact, I checked the code for recorder.js, which is only 90 lines of simple javascript, only html5 and javascript.

UPDATE: I found one online demo that is experimenting with this, and it seems to work fine and all the source code is open. You can check it out. Link here: Recorder JS

Here is another link to customize it and make it more functional. MP3 recording using only HTML5 and JavaScript

+6
source

Source: https://habr.com/ru/post/970053/


All Articles