使用 java 和 Web Socket 在 Web 浏览器中显示 RTSP 实时流

Question

我想编写一个 java 程序来解码来自 IP 摄像机的 RTSP 实时流，并通过网络套接字将其发送到 HTML5 网络客户端。当我的电脑上有一个简单的 mp4 文件时，我可以做到这一点。我的代码如下所示：

JAVA

@ServerEndpoint("/echo")
public class EchoEndPoint {

@OnMessage
public byte[] echo(String message) {
    File file = new File("/home/maher/devTools/video/testVideo.mp4");
    byte[] data = new byte[(int) file.length()];
    DataInputStream stream = null;
    try {
        stream = new DataInputStream(new FileInputStream(file));
    } catch (FileNotFoundException e1) {
        // TODO Auto-generated catch block
        e1.printStackTrace();
    }
    if (stream != null) {
        try {
            stream.readFully(data);
        } catch (IOException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        try {
            stream.close();
        } catch (IOException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }
    return data;
    }
  }

HTML

<!DOCTYPE html>
<html>
<head>
<title>Test streaming over WebSockets</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<script language="javascript" type="text/javascript">
    var wsUri = "ws://localhost:7070/serverWs/echo";
    function init() {
        websocket = new WebSocket(wsUri);
        websocket.onmessage = function (evt) {
            readFile(evt.data);
        };
    }
    function readFile(fileData) {
        var video = document.getElementById('area');
        video.src = window.URL.createObjectURL(fileData);
    }
    function createObjectURL(file) {
        if (window.webkitURL) {
            return window.webkitURL.createObjectURL(file);
        } else if (window.URL && window.URL.createObjectURL) {
            return window.URL.createObjectURL(file);
        } else {
            return null;
        }
    }
    function startVideo() {
        var message = "startVideo";
        websocket.send(message);
    }
    window.addEventListener("load", init, false);
</script>
</head>


<body>
<h2 style="text-align: center;">Client WebSocket Echo</h2>
<div style="text-align: center;">
<input onclick="startVideo()" value="Start video" type="button">
</div>
<div>
<video id='area' controls="controls" autoplay></video>
</div>

</body>
</html>

但是当涉及实时 RTSP 流时 URL，我找不到一种方法来解码流并通过 WS 发送它然后在我的网页中显示该流。

Answer 1

除非您真的出于教育目的或为了满足某些其他要求而自己动手，否则您可能会发现围绕现有流媒体服务器构建服务会更容易。

这是因为视频流是一个非常专业的领域，并且有许多编解码器、容器、流协议等，您可能需要在它们之间进行转换以支持不同的终端设备、浏览器等。

此外，如果您想提供良好的用户体验，您可能希望提供多种比特率的直播流，以便客户端可以根据当前的网络状况、屏幕大小等在它们之间切换。

大多数流媒体服务器将支持将视频转码为不同的格式，并支持流式传输多种比特率以实现自适应比特率流式传输。

GStreamer (https://gstreamer.freedesktop.org) 是一个开源流媒体，您可能会发现它会满足您的需求 - 即使它不能满足您的需求，它也是一个很好的参考实现。

您可以在此处查看有关其 RTSP 支持的信息：https://gstreamer.freedesktop.org/documentation/rtp.html

Answer 2

我无法回复第一条评论，但如果是这样的话，答案将不符合实时（相对于直播）要求。评论建议会增加 10-20+ 秒的流延迟。

有几个 RTSP 到服务器端到 WebSocket 到客户端 solutions/options/examples:

https://github.com/Streamedian/ https://www.npmjs.com/package/node-rtsp-stream https://medium.com/@chpmrc/how-to-stream-rtsp-on-the-web-using-web-sockets-and-canvas-d821b8f7171e

Web/HTML5 正在远离 Flash（和类似的 plugins/ActiveX），通过更直接的 RTP/RTSP/RTMP（基于 UDP 的）流允许更好的延迟。随着时间的推移，WebRTC 可能会成为替代解决方案。 HLS/Adaptive 比特率等将有 10-20 秒以上的延迟。
直播 (Concerts/Events) 一直在推动流媒体发展（Azure/Facebook/Wowza/AWS 提供商），其中 20-40 秒的延迟通常不是问题

使用 java 和 Web Socket 在 Web 浏览器中显示 RTSP 实时流

Display RTSP live stream in the web browser using java and Web Socket

java

video

websocket

rtsp