SourceBuffer函数appendBuffer不追加ArrayBuffer

时间:2019-06-25 03:00:24

标签: javascript webrtc media-source

不确定这行代码在哪里出问题:

this.sourceBuffer.appendBuffer(this.arrayBuffer);

this.arrayBuffer是ArrayBuffer:

ArrayBuffer(612916) {}
[[Int8Array]]: Int8Array(612916) [0, 26, 1, 115, -59, -121, 63, -73, 46, -83, 11, -43, 101, -125, …]
[[Int16Array]]: Int16Array(306458) [6656, -8379, -24669, -31166, 385, -2238, 385, -3518, 1153, -3262, 2177, -32190, 30596, 25189, …]
[[Int32Array]]: Int32Array(153229) [0, -2068476447, 8403783, 1644265887, -1373601436, 42063785, 47865 -2092334464, …]
[[Uint8Array]]: Uint8Array(612916) [0, 111 …]
byteLength: (...)
__proto__: ArrayBuffer 

但是当javascript行到时:

this.sourceBuffer.appendBuffer(this.arrayBuffer);

我收到一条错误消息:

ERROR TypeError: Cannot read property 'appendBuffer' of undefined

这是完整的代码行

declare var MediaRecorder: any;
@Component({
  selector: 'app-webrtc',
  templateUrl: './webrtc.component.html',
  styleUrls: ['./webrtc.component.scss']
})
export class WebrtcComponent implements AfterViewInit, OnInit {
  constraints; video; recordedVideo; mediaRecorder; options;
  arrayBuffer: ArrayBuffer;
  sourceBuffer: any;
  mediaSource: MediaSource;

  constructor(private signalHub: WebRTCServiceService) {
    this.constraints = { audio: true, video: true };
  }

  ngOnInit() {
    this.signalHub.getHubStream().subscribe(data => {
    });
    this.signalHub.currentarrBuffer.subscribe(data => {
      this.arrayBuffer = data;
    });
    this.recordedVideo = document.getElementsByClassName('other-video')[0];
  }

  ngAfterViewInit() {
  }

  getStream() {
    this.signalHub.getStream();
  }

  startExternalVideo(){
    //this.mediaSource = this.mediaSource.addSourceBuffer('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
    console.log(this.arrayBuffer);
    this.sourceBuffer.appendBuffer(this.arrayBuffer);
    console.log(this.arrayBuffer);
    console.log(this.sourceBuffer);
    this.recordedVideo.srcObject = this.sourceBuffer;
    this.recordedVideo.play();
  }
}

使用Angular,使用socket.io从节点服务器获取ArrayBuffer。

我尝试使用MediaSource首先创建媒体源。但是,如果我不能首先将ArrayBuffer转换为SourceBuffer,该如何使用MediaSource然后添加SourceBuffer?

编辑:

尝试使用Blob而不是Buffer。

this.blob = new Blob([new Uint8Array(this.arrayBuffer)],{'type':'audio / ogg; codecs = opus'}); this.recordedVideo.srcObject = window.URL.createObjectURL(this.blob);

但是我收到一个错误消息:

ERROR TypeError: Failed to set the 'srcObject' property on 'HTMLMediaElement': The provided value is not of type 'MediaStream'.

Blob是MediaStream可接受的类型。

0 个答案:

没有答案