从 Safari 上的服务器获取后，音频文件的大小始终为常数

如何解决从 Safari 上的服务器获取后，音频文件的大小始终为常数

我正在编写用于录制音频的服务。录制后，我将其发送到 API，当用户单击“播放”按钮时，我从 API 获取该音频文件并播放它。但出于某种原因，如果我在 Safari 中录制该音频，在保存 API 并获取它后，它只会播放整个音频的 1 秒，因为它的大小始终是常数 - 8683。在 Chrome 中一切正常。

还要补充一点，录完后，可以成功播放。只有在保存记录后才会出现问题。

这是我的录音服务：

export class VoiceRecorder {
    public recording: boolean = false;

    private stream: MediaStream;
    // @ts-ignore
    private mediaRecorder: MediaRecorder;
    // @ts-ignore
    private audioChunks: BlobPart[] = [];

    public start(): Observable<void> {
        this.recording = true;
        this.audioChunks = [];
        return new Observable(observer => {
            navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
                this.stream = stream
                // @ts-ignore
                this.mediaRecorder = new MediaRecorder(this.stream);
                // @ts-ignore
                this.mediaRecorder.addEventListener("dataavailable",(event: BlobEvent) => {
                    this.audioChunks.push(event.data);
                });
                this.mediaRecorder.start();
                observer.next();
                observer.complete();
            },(error: DOMException) => {
                this.recording = false;
                observer.error(error.message);
                observer.complete();
            });
        });
    }

    public stop(): Observable<IVoiceFile> {
        if (this.mediaRecorder.state === 'inactive') {
            return of(null);
        }
        return new Observable<IVoiceFile>(observer => {
            this.mediaRecorder.addEventListener("stop",() => {
                const audioBlob = new Blob(this.audioChunks,{ type: 'audio/mpeg' });
                const audioUrl = URL.createObjectURL(audioBlob);
                const audio = new Audio(audioUrl);
                this.stream.getTracks().forEach(track => track.stop());
                observer.next({ audioBlob,audioUrl });
                this.mediaRecorder = null;
                this.stream = null;
                this.recording = false;
                observer.complete();
            });
            this.mediaRecorder.stop();
        });
    }
}

我已经尝试更改音频格式（audio/ogg、audio/weba、audio/webm、audio/mp3、audio/aac、audio/acc），但没有成功。

有什么想法吗？

解决方法

在我看来，您的 dataavailable 处理程序的调用频率不够高。

尝试在 .start() 中使用时间间隔，就像这样。每 500 毫秒 500 次请求调用。

 this.mediaRecorder.start(500);

并确保您的 dataavaiable 处理程序被重复调用。它可能不会每半秒被调用一次，但应该多次调用。

然后，调用 this：

this.mediaRecorder.requestData();

就在您停止录制之前，确保您获得最后一块录制的数据。

话虽如此，Safari 对媒体内容的实现落后于 Chrome。