JavaScript 實現音訊剪下
阿新 • • 發佈:2020-10-20
前端實現音訊剪下,實際上是把需要的部分複製出來。
剪下audiobuffer
引用:JS純前端實現audio音訊剪裁剪下複製播放與上傳
實現的原理很簡單,建立一個空的AudioBuffer,複製現有的通道資料前3秒的資料,然後複製的內容寫入到這個空的AudioBuffer,於是我們就得到了一個剪裁後的音訊Buffer資料了。
// 聲道數量和取樣率 var channels = audioBuffer.numberOfChannels; var rate = audioBuffer.sampleRate; // 擷取前3秒 var startOffset = 0; var endOffset = rate * 3; // 3秒對應的幀數 var frameCount = endOffset - startOffset; // 建立同樣採用率、同樣聲道數量,長度是前3秒的空的AudioBuffer var newAudioBuffer = new AudioContext().createBuffer(channels, endOffset - startOffset, rate); // 建立臨時的Array存放複製的buffer資料 var anotherArray = new Float32Array(frameCount); // 聲道的資料的複製和寫入 var offset = 0; for (var channel = 0; channel < channels; channel++) { audioBuffer.copyFromChannel(anotherArray, channel, startOffset); newAudioBuffer.copyToChannel(anotherArray, channel, offset); } // newAudioBuffer就是全新的複製的3秒長度的AudioBuffer物件
剪下arraybuffer
實現原理同上,不同的是,在計算音訊長度是,duration的值為arraybuffer的長度除以samplerate除以2。之所以除以2是因為duration是16bit的pcm格式長度,而arraybuffer的bytelength是8bit的。
const startOffset = 0; const clipDuration = 3;//擷取前3秒 const clipBuffer = audioBuffer.slice(startOffset , clipDuration * 2 * sampleRate); // clipBuffer 就是全新的複製的3秒長度的Arraybuffer的物件