鍍金池/ 問(wèn)答/HTML5  C  影視  網(wǎng)絡(luò)安全  HTML/ pc瀏覽器獲取音頻流,怎樣實(shí)時(shí)傳給后臺(tái)

pc瀏覽器獲取音頻流,怎樣實(shí)時(shí)傳給后臺(tái)

代碼:
if (navigator.getUserMedia) {

        navigator.getUserMedia(
            // constraints
            {
                //video: true,
                audio: true
            },
            // successCallback
            function (localMediaStream) {
                var audio = document.querySelector('audio');
                console.log(localMediaStream,'嘻嘻嘻');
                audio.src = window.URL.createObjectURL(localMediaStream);
                console.log(audio.src,'吱吱吱')
                // do whatever you want with the video
                audio.play();
            },
            // errorCallback
            function (err) {
                console.log("The following error occured: " + err);
            });
    } else {
        alert("getUserMedia not supported by your web browser or Operating system version");
    }
    
    
    localMediaStream是通過(guò)pc端麥克風(fēng)獲取的音頻流,可以轉(zhuǎn)化成blob形式的url,加在audio上就可以播放出來(lái)。
    問(wèn)題:localMediaStream這個(gè)視頻流怎樣實(shí)時(shí)傳遞給后端,(類(lèi)似于直播那種),我目前能做到的是將這個(gè)音頻流先保存成mp3,再傳給后臺(tái)。
    這個(gè)視頻流怎樣實(shí)時(shí)傳遞?
回答
編輯回答
礙你眼

可以實(shí)時(shí)的把blob通過(guò)ajax提交給后端

2018年6月15日 13:37
編輯回答
久舊酒

視頻和音頻原理一樣,這里以音頻為例。

其實(shí)這個(gè)問(wèn)題你需要和后臺(tái)協(xié)商的, 假設(shè)后臺(tái)有一個(gè)接受文件流的接口,那么代碼類(lèi)似這樣:

navigator.getUserMedia(
            // constraints
            {
                //video: true,
                audio: true
            },
            // successCallback
            function (localMediaStream) {
               fetch(url, {
                   method: 'POST',
                   body: localMediaStream
               })
            },
            // errorCallback
            function (err) {
                console.log("The following error occured: " + err);
            });
    } else {
        alert("getUserMedia not supported by your web browser or Operating system version");
    }
2018年7月14日 08:38