网络工作者不与反应组件通信
web worker not communicating with react component
我在我的 React 项目中使用 audio-recorder-polyfill，以便为 Safari 录制音频。它似乎可以让录音发生，但是，没有可用的音频数据。事件 "dataavailable" 永远不会被触发，并且在停止记录后似乎也没有数据 "compiled"。
recordFunc() {
navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
recorder = new MediaRecorder(stream);
// Set record to <audio> when recording will be finished
recorder.addEventListener('dataavailable', e => {
this.audio.current.src = URL.createObjectURL(e.data);
})
// Start recording
recorder.start();
})
}
stopFunc() {
// Stop recording
recorder.stop();
// Remove “recording” icon from browser tab
recorder.stream.getTracks().forEach(i => i.stop());
}
audio-recorder-polyfill's issue tracker 上发布了很多类似的问题。
a
b
c
d
e
根本原因
其中一个问题 #4 (not listed above) 仍未解决。关于该问题跟踪器的几条评论暗示根本问题是 Safari 取消 AudioContext 如果它不是在处理程序中为用户交互（例如点击）创建的。
可能的解决方案
如果您满足以下条件，您也许能够让它工作：
- 在用户交互处理程序中进行初始化（即
<button onclick="recordFunc()">）
- 不要尝试将
getUserMedia() 返回的 MediaStream 重新用于多个记录
- 不要在同一页面上尝试超过 4（或 6？）个录音（来源 [1], [2] 提到 Safari 会阻止它）
替代库
您也许还可以尝试 StereoAudioRecorder class from the RecordRTC 软件包，该软件包拥有更多用户 (3K) 但看起来维护较少，并且可能会工作
即将到来的支持
如果您更愿意坚持使用 MediaRecorder API 而上面的提示对您不起作用，好消息是有 experimental support for MediaRecorder in Safari 12.4 and up (iOS and macOS)，它似乎得到支持在最新的 Safari 技术预览中。
另见
我在我的 React 项目中使用 audio-recorder-polyfill，以便为 Safari 录制音频。它似乎可以让录音发生，但是，没有可用的音频数据。事件 "dataavailable" 永远不会被触发，并且在停止记录后似乎也没有数据 "compiled"。
recordFunc() {
navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
recorder = new MediaRecorder(stream);
// Set record to <audio> when recording will be finished
recorder.addEventListener('dataavailable', e => {
this.audio.current.src = URL.createObjectURL(e.data);
})
// Start recording
recorder.start();
})
}
stopFunc() {
// Stop recording
recorder.stop();
// Remove “recording” icon from browser tab
recorder.stream.getTracks().forEach(i => i.stop());
}
audio-recorder-polyfill's issue tracker 上发布了很多类似的问题。 a b c d e
根本原因
其中一个问题 #4 (not listed above) 仍未解决。关于该问题跟踪器的几条评论暗示根本问题是 Safari 取消 AudioContext 如果它不是在处理程序中为用户交互（例如点击）创建的。
可能的解决方案
如果您满足以下条件，您也许能够让它工作：
- 在用户交互处理程序中进行初始化（即
<button onclick="recordFunc()">） - 不要尝试将
getUserMedia()返回的MediaStream重新用于多个记录 - 不要在同一页面上尝试超过 4（或 6？）个录音（来源 [1], [2] 提到 Safari 会阻止它）
替代库
您也许还可以尝试 StereoAudioRecorder class from the RecordRTC 软件包，该软件包拥有更多用户 (3K) 但看起来维护较少，并且可能会工作
即将到来的支持
如果您更愿意坚持使用 MediaRecorder API 而上面的提示对您不起作用，好消息是有 experimental support for MediaRecorder in Safari 12.4 and up (iOS and macOS)，它似乎得到支持在最新的 Safari 技术预览中。