Javascript 如何在React/Node web应用程序中无缝录制/修剪/组合音频

Javascript 如何在React/Node web应用程序中无缝录制/修剪/组合音频,javascript,node.js,reactjs,ffmpeg,web-audio-api,Javascript,Node.js,Reactjs,Ffmpeg,Web Audio Api,我为浏览器开发了一个数字音频工作站,您可以查看。本质上,它帮助作者在家里讲述自己的有声读物 我希望显著提高音频文件合并或修剪的速度 现在,用户录制的音频量可变(一行、一段或整段)。当用户停止录制时,此剪辑将使用like so添加到该节的主音频文件中: 在每个录制的剪辑之后,用户都必须等待几秒钟,以完成连接过程——主文件或录制的剪辑越长,用户等待的时间就越长。看看其他基于浏览器的音频编辑器,例如,显然可以在零等待时间的情况下实现无缝录制和编辑体验,但我似乎不知道如何在我的react应用程序中实现这

我为浏览器开发了一个数字音频工作站,您可以查看。本质上,它帮助作者在家里讲述自己的有声读物

我希望显著提高音频文件合并或修剪的速度

现在,用户录制的音频量可变(一行、一段或整段)。当用户停止录制时,此剪辑将使用like so添加到该节的主音频文件中:

在每个录制的剪辑之后,用户都必须等待几秒钟,以完成连接过程——主文件或录制的剪辑越长,用户等待的时间就越长。看看其他基于浏览器的音频编辑器,例如,显然可以在零等待时间的情况下实现无缝录制和编辑体验,但我似乎不知道如何在我的react应用程序中实现这一点

是否可以在React应用程序中无缝组合或修剪音频数据?FFMPEG是最好的方法,还是有更简单的方法使用纯javascript

        if (duration === 0) {
            //concatenate the two files (they should already be written to memory)
            await ffmpeg.run('-i', 'concat:fullAudio.mp3|clip.mp3', '-c', 'copy', 'fullAudio.mp3');

        } else {
            //Set the insert time to wherever the user's cursor is positioned
            let insertTime = duration;
            if (selectedObj) {
                insertTime = selectedObj.endTime;
            }

            //split the audio file into two parts at the point we want to insert the audio
            await ffmpeg.run('-i', 'fullAudio.mp3', '-t', `${insertTime}`, '-c', 'copy', 'part1.mp3', '-ss',  `${insertTime}`, '-codec', 'copy', 'part2.mp3');

            //concatenate the three files
            await ffmpeg.run('-i', 'concat:part1.mp3|clip.mp3', '-acodec', 'copy', 'intermediate.mp3');
            await ffmpeg.run('-i', 'concat:intermediate.mp3|part2.mp3', '-acodec', 'copy', 'fullAudio.mp3');
        }

        //Read the result from memory
        const data = ffmpeg.FS('readFile', 'fullAudio.mp3');

        //Create URL so it can be used in the browser
        const url = URL.createObjectURL(new Blob([data.buffer], { type: 'audio/mp3' }));
        globalDispatch({ type: "setFullAudioURL", payload: url });