共計 1446 個字符，預計需要花費 4 分鐘才能閱讀完成。

今天丸趣 TV 小編給大家分享一下 html5 怎么實現發送語音消息的相關知識點，內容詳細，邏輯清晰，相信大部分人都還太了解這方面的知識，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來了解一下吧。

實現思路

1、使用 getUserMedia 需要考慮各個瀏覽器的差異

2、使用 WebWorker 來處理錄音及音頻轉換。

3、轉為 Base64 格式的 WAV，用于瀏覽器播放（此處需要注意，可以轉換 Blob 直接播放，此處為了說明轉換音頻的接口，所以轉為 Baes64）。

具體實現

1、開始錄音：RongRecorder.record();

調用此方法開始錄音。

2、停止錄音：RongRecorder.stop();

調用此方法停止錄音。

3、停止并導出：RongRecorder.stopAndExport(type,callback);

調用此方法停止并導出音頻為指定的 type 類型

4、導出：RongRecorder.exportRecord(type);

導出指定 type 類型的音頻流。

5、清空本地音頻流：RongRecorder.clear();

演示

1、兼容 getUserMedia 代碼片段

navigator.getUserMedia = navigator.getUserMedia ||navigator.webkitGetUserMedia ||navigator.mozGetUserMedia; 2、WebWorker 代碼片段

this.onmessage = function(e){ switch(e.data.command){ case  init : init(e.data.config); break; case  record : record(e.data.buffer); break; case  exportRecord : exportRecord(e.data.type); break; case  clearRecord : clearRecord(); break; }};function init(config){ sampleRate = config.sampleRate;}function clearRecord(){ recBuffersL.length = 0; recLength = 0;}function record(inputBuffer){ recBuffersL.push(inputBuffer[0]); //recBuffersR.push(inputBuffer[1]); recLength += inputBuffer[0].length;}function exportRecord(type){ var bufferL = mergeBuffers(recBuffersL, recLength); var interleaved = interleave(bufferL); var dataview = encodeWAV(interleaved); var audioBlob = new Blob([dataview], { type: type }); this.postMessage(audioBlob);}

以上就是“html5 怎么實現發送語音消息”這篇文章的所有內容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，丸趣 TV 小編每天都會為大家更新不同的知識，如果還想學習更多的知識，請關注丸趣 TV 行業資訊頻道。