在 Gstreamer 的 MediaSource sourcebuffer 中解码 h264 视频

Question

我通过 gstreamer 管道生成一个 h264 基线配置文件级别 2 视频：

... ! videoenc ! queue ! h264parse ! appsink caps=video/x-h264,alignment=(string)au

我在 html 页面中收到流：

this.mediaSource = new MediaSource();
console.log(MediaSource.isTypeSupported('video/mp4; codecs="avc1.424014"'));//True
const vv = document.getElementById("mytryplayer") as HTMLVideoElement;
vv.src = URL.createObjectURL(this.mediaSource);
this.mediaSource.addEventListener('sourceopen', (_) => {
        this.sourceBuffer = this.mediaSource.addSourceBuffer('video/mp4; codecs="avc1.424014"');
        this.sourceBuffer.addEventListener('updatestart', function(e) { console.log('updatestart: ' + e); });
        this.sourceBuffer.addEventListener('error', function(e) { console.log('error: ' + e); });
});

我喂：

this.sourceBuffer.appendBuffer(received_stream_from_app_sink);

Gstreamer app_sink 发送数据并在 HTML 页面的“received_stream_from_app_sink”中正确接收。我可以在 Android 中解码相同的流，所以我知道传输和原始视频流都是正确的。

第二个数据包后，我收到错误回调，源缓冲区正在关闭。

知道我做错了什么吗？