录音直接保存数据库 [英] Audio recording directly save database

查看:56
本文介绍了录音直接保存数据库的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="https://cdn.webrtc-experiment.com/commits.js"></script>
    <script src="https://cdn.WebRTC-Experiment.com/MediaStreamRecorder.js"></script>
    <script src="https://cdn.WebRTC-Experiment.com/gumadapter.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>




    <script>

        function captureUserMedia(mediaConstraints, successCallback, errorCallback) {
            navigator.mediaDevices.getUserMedia(mediaConstraints).then(successCallback).catch(errorCallback);
        }

        var mediaConstraints = {
            audio: true
        };
        document.querySelector('#save-recording').onclick = function () {
            this.disabled = true;
            mediaRecorder.save();
            // alert('Drop WebM file on Chrome or Firefox. Both can play entire file. VLC player or other players may not work.');
        };
        function startRecording(idx) {
            $('#start-recording').disabled = true;
            audiosContainer = document.getElementById('audios-container');
            document.getElementById("clicks").innerHTML = "Recording Started";

            var f = document.getElementById('clicks');
            setInterval(function () {
                f.style.display = (f.style.display == 'none' ? '' : 'none');
            }, 1000);

            captureUserMedia(mediaConstraints, onMediaSuccess, onMediaError);
        };

        function stopRecording() {
            $('#stop-recording').disabled = true;

            document.getElementById("clicks").innerHTML = "Recording Stopped";

            var f = document.getElementById('clicks');
            setInterval(function () {
                f.style.display = (f.style.display == 'none' ? '' : 'none');
            }, 1000);
            mediaRecorder.stop();
            mediaRecorder.stream.stop();


            $('.start-recording').disabled = false;
        };

        function saveRecording() {
            mediaRecorder.save();
        };

        var mediaRecorder;

        function onMediaSuccess(stream) {
            mediaRecorder = new MediaStreamRecorder(stream);
            mediaRecorder.stream = stream;
            mediaRecorder.mimeType = 'audio/wav';
            mediaRecorder.audioChannels = 1;
            mediaRecorder.ondataavailable = function (blob) {
                $('#record-audio').html("<audio controls=''><source src=" + URL.createObjectURL(blob) + "></source></audio>");
            };

            var timeInterval = 360 * 1000;

            mediaRecorder.start(timeInterval);

            $('#stop-recording').disabled = false;
        }

        function onMediaError(e) {
            console.error('media error', e);
        }

        function bytesToSize(bytes) {
            var k = 1000;
            var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
            if (bytes === 0) return '0 Bytes';
            var i = parseInt(Math.floor(Math.log(bytes) / Math.log(k)), 10);
            return (bytes / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i];
        }

        function getTimeLength(milliseconds) {
            var data = new Date(milliseconds);
            return data.getUTCHours() + " hours, " + data.getUTCMinutes() + " minutes and " + data.getUTCSeconds() + " second(s)";
        }

        window.onbeforeunload = function () {
            $('#start-recording').disabled = false;
        };


 
    </script>


</head>
<body>

    <button class="btn btn-primary" id="start-recording" onclick="startRecording()">Recording Start</button>
    <button class="btn btn-default" id="stop-recording" onclick="stopRecording()">Stop</button>
    <button class="btn btn-default" id="save-recording" onclick="saveRecording()">Save</button>
    <div id="record-audio"></div>
    <span id="clicks">0</span>
 
</body>
</html>





我尝试过:





What I have tried:

How to Audio Recording Directly save database please Help me not file we have path only how to retrieve 

推荐答案

('#start-recording')。disabled = true;
audiosContainer = document.getElementById('audios-container');
document.getElementById(clicks)。innerHTML =Recording Started;

var f = document.getElementById('clicks');
setInterval(function(){
f.style.display =(f.style.display =='none'?'':'none');
},1000);

captureUserMedia(mediaConstraints,onMediaSuccess,onMediaError);
};

function stopRecording(){
('#start-recording').disabled = true; audiosContainer = document.getElementById('audios-container'); document.getElementById("clicks").innerHTML = "Recording Started"; var f = document.getElementById('clicks'); setInterval(function () { f.style.display = (f.style.display == 'none' ? '' : 'none'); }, 1000); captureUserMedia(mediaConstraints, onMediaSuccess, onMediaError); }; function stopRecording() {


('#stop-recording')。disabled = true;

document.getElementById(clicks)。innerHTML =Recording Stopped;

var f = document.getElementById('clicks');
setInterval(function(){
f.style.display =(f.style.display =='none'?'':'none');
},1000);
mediaRecorder.stop();
mediaRecorder.stream.stop();
('#stop-recording').disabled = true; document.getElementById("clicks").innerHTML = "Recording Stopped"; var f = document.getElementById('clicks'); setInterval(function () { f.style.display = (f.style.display == 'none' ? '' : 'none'); }, 1000); mediaRecorder.stop(); mediaRecorder.stream.stop();


('.start-recording')。disabled = false;
};

函数saveRecording(){
mediaRecorder.save();
};

var mediaRecorder;

函数onMediaSuccess(stream){
mediaRecorder = new MediaStreamRecorder(stream);
mediaRecorder.stream = stream;
mediaRecorder.mimeType ='audio / wav';
mediaRecorder.audioChannels = 1;
mediaRecorder.ondataavailable = function(blob){
('.start-recording').disabled = false; }; function saveRecording() { mediaRecorder.save(); }; var mediaRecorder; function onMediaSuccess(stream) { mediaRecorder = new MediaStreamRecorder(stream); mediaRecorder.stream = stream; mediaRecorder.mimeType = 'audio/wav'; mediaRecorder.audioChannels = 1; mediaRecorder.ondataavailable = function (blob) {


这篇关于录音直接保存数据库的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆