mediaDevices.getUserMedia，音频播放完毕后开始麦克风录音，Safari问题

Question

有一个我不清楚的情况。

我想要的是：播放一段音频，音频播放完毕后，开始麦克风录音。

问题：在 FF 和 Chrome 中，代码工作正常。然而在Safari上，当音频停止播放并开启麦克风录音功能时，音频会同时再次播放。

开始和结束挂钩用 jQuery 完成。这是结束的绑定。

var on_audio_stop = function() {
    start_microphone_recording();
}
$( 'audio' ).bind( 'ended', on_audio_stop );

start_microphone_recording 函数调用一个函数，其中图标被更改，然后 init_recording 被调用，仅此而已，所以我没有包括那个。

启动麦克风功能：

function init_recording() {
    AudioContext = window.AudioContext || window.webkitAudioContext;

    context = new AudioContext();

    processor = context.createScriptProcessor( buffer_size, 1, 1 );

    processor.connect( context.destination );

    var handle_success = function ( stream ) {
        global_stream = stream;

        input = context.createMediaStreamSource( stream );

        input.connect( processor );

        processor.onaudioprocess = function ( e ) {
            microphone_process( e );
        };
    };

    navigator.mediaDevices.getUserMedia( constraints ).then( handle_success );
}

在 Safari 中激活麦克风时，将执行 "play" 绑定功能。我试过 pause() 并静音但不起作用。还尝试删除音频标签并从音频标签中清除 src。

有人知道为什么 Safari 这样做以及解决方案是什么吗？

示例：我在 html 中的 AUDIO 标签中设置了 5 个 MP3 音频，我一个一个播放，我运行 "init_recording" 功能和 Safari 将同时播放所有 5 个 MP3 音频, 当麦克风开始录音时，彼此重叠。

Answer 1

事实证明，Safari 的解决方案是不设置 src 属性。

如果您有一个或多个内联 audio 标签，请从 audio 标签中删除 src 属性，例如将数据属性设置为 data-src。然后用JS点击播放的时候，在audio标签的src后面加上URL。

播放功能：

audio.pause();
audio.load(); // Load the audio URL that was added to the src tag.
audio.play();

或者通过JS插入整个audio标签。

Answer 2

在 Safari 上遇到同样的问题，删除和添加 src 标签不是一个很好的解决方案，这不是我的问题。我的音频标签甚至没有在 dom 中呈现，但 Safari 仍在录制时播放它。

在我的例子中，删除 autoplay 属性并在装载时手动播放音频（我使用 React）就成功了

mediaDevices.getUserMedia，音频播放完毕后开始麦克风录音，Safari问题

mediaDevices.getUserMedia, start microphone recording after audio has finished playing, Safari problem

javascript

safari

audio

getusermedia

mediadevices