2017-06-07 34 views
0

IpカメラからのRTSPライブストリームをデコードし、Webソケット経由でHTML5 Webクライアントに送信するJavaプログラムを作成します。 私はそれが私のPC上のシンプルなmp4ファイルになるとすることができます。JavaとWebソケットを使用してWebブラウザにRTSPライブストリームを表示

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はそのストリームを私のWebページに表示します。

答えて

1

教育的な目的や他の要件を満たすことを本当に望む場合を除き、既存のストリーミングサーバーの周りにサービスを構築する方が簡単です。

ビデオストリーミングはかなりの専門領域であり、あなたの場合、多くのコーデック、コンテナ、あなたは別のエンドデバイスをサポートするための間で変換する必要があるかもしれませんプロトコルなどのストリーミング、ブラウザなど

が、さらにあるためですライブストリームを複数のビットレートで提供して、現在のネットワーク状態、画面サイズなどに応じてクライアント間で切り替えることができます。

ほとんどのストリーミングサーバーは、適応ビットレートストリーミングのために複数のビットレートをフォーマットし、ストリーミングする。

GStreamer(https://gstreamer.freedesktop.org)は、あなたが必要とするオープンソースのストリーマです。見た目の良い参考実装になるとは限りません。 https://gstreamer.freedesktop.org/documentation/rtp.html

0

私が最初のコメントに返信カントが、それは願望であれば答えはリアルタイム(対ライブストリーム)の要件を満たしています:

あなたはここでそのRTSPのサポートに関する情報を見ることができます。コメントの提案は、ストリーム待ち時間に10〜20秒を追加します。

は、クライアント側のソリューション/オプション/例にWebSocketのためにサーバ側にRTSPのカップルがあります。

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

  • ウェブ/ HTML5は、(フラッシュから遠ざかっています&類似のプラグイン/ ActiveX)を使用して、より直接的なRTP/RTSP/RTMP(UDPベース)ストリームを介してより良い待ち時間を可能にします。 WebRTCは時間のある代替ソリューションかもしれません。 HLS /アダプティブビットレートなどは、10-20 +秒のレイテンシヒットとなります。 20-40s遅延は通常

問題ではありません

  • ライブストリーミング(コンサート/イベント)ストリーミング開発を推進してきた(アズール/ Facebookの/ Wowza/AWSの提供)

  • 関連する問題