angular - 无法使用 Angular 显示 RTSP 流

Question

我正在开发一个 Angular 网络应用程序，我需要在我的窗口中显示一个 rtsp 流。
我正在使用与此主题相关的 JSMpeg 播放器:Not able to Show live camera RTSP streaming with Angular .

对于我的 websocket，我使用了节点 websocket 库，并在我的 cmd 中像这样运行它:node websocket-relay.js supersecret 8081 8082
它检测我在其上建立的每个连接。

然后对于转换部分，我使用了 FFMPEG，其中我 将 h264 格式转换为 mpegts (mpegvideo1 给了我一个错误)
我这样运行它:
ffmpeg -i "rtsp://myurl/media.smp" -vcodec h264 -f mpegts -max_muxing_queue_size 9999 -b 800k -r 30 http://localhost:8081/supersecret/640/480/
对于 Angular 部分，我有这个:

@ViewChild('streaming', {static: true}) streamingcanvas: ElementRef; 

constructor( ... ) { }

ngOnInit() {
    ....
    let player = new JSMpeg.Player('ws://localhost:8081/supersecret', {
        canvas: this.streamingcanvas, autoplay: true, audio: false, loop: true
      })
}

结果在我的窗口中:


我错过了什么让它工作并获得真正的视频流？

感谢帮助

编辑:我的第一个 ffmpeg 命令是错误的，只发送了音频，现在我得到了:

ffmpeg -i "rtsp://myurl/media.smp" -vcodec h264 -f mpegts -codec:v mpeg1video -s 640x360 -b: 700k -r 25 -bf 0 -codec:a mp2 -ar 44100 -ac 1 -b:a 64k -max_muxing_queue_size 9999 http://localhost:8081/supersecret/640/360/

它仍然不起作用，但 Canvas 不再是黑色了

Answer 1

Usage:
node websocket-relay.js <secret> [<stream-port> <websocket-port>]

试试 ws://localhost:8082/supersecret