-3

我得到了 RTSP URL,但它不能在 ReactJS 播放器中使用。react 播放器只支持 HTTP URL,播放器也不支持所有流。

React 播放器或 React JS 中的 RTSP URL 没有任何支持。

如何在 React js 中实现 RTSP URL 的直播

4

1 回答 1

0

设置一个 apache 服务器并在 /var/www/html/ 中创建一个 index.html 文件

          <!DOCTYPE html>
           <html><head><title>Live Cam</title></head>

            <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
            <body>

            <video id="video" autoplay="true" width="975px" height="650px" 
             controls="controls"></video>
            <script>
            if (Hls.isSupported()) {
            var video = document.getElementById('video');
            var hls = new Hls();
            // bind them together
             hls.attachMedia(video);
             hls.on(Hls.Events.MEDIA_ATTACHED, function () {
              console.log("video and hls.js are now bound together !");
             hls.loadSource("'ip address of system'/live/mystream.m3u8");
             hls.on(Hls.Events.MANIFEST_PARSED, function (event, data) {
             console.log("manifest loaded, found " + data.levels.length + " 
              quality level");
               });
              });
             }
            </script>

            </body>
             </html>

然后创建一个 live 文件夹并在该文件夹内创建一个 stream.sh 文件并插入代码 #!/bin/bash

  VIDSOURCE="rtsp://username:password@192.168.140.14/h265/ch1/main/av_stream" 
         AUDIO_OPTS="-c:a aac -b:a 160000 -ac 2"
         VIDEO_OPTS="-s 854x480 -c:v libx264 -b:v 800000"
         OUTPUT_HLS="-hls_time 10 -hls_list_size 10 -start_number 1"
          ffmpeg -i "$VIDSOURCE" -y $AUDIO_OPTS $VIDEO_OPTS $OUTPUT_HLS 
         mystream.m3u8 

创建文件后,运行 apache 服务器并通过键入命令运行上述脚本

        sudo ./stream.sh

运行上述服务器和文件“系统的IP地址”后在浏览器中运行

你可以得到直播

于 2019-08-06T11:17:20.220 回答