サーバーhttp://lscube.org/projects/fengからRTSP / RTPストリームを再生する必要があるWebアプリを構築しています。
HTML5ビデオ/オーディオタグはrtspまたはrtpをサポートしていますか?そうでない場合、最も簡単な解決策は何でしょうか?おそらく、VLCプラグインなどにドロップダウンします。
サーバーhttp://lscube.org/projects/fengからRTSP / RTPストリームを再生する必要があるWebアプリを構築しています。
HTML5ビデオ/オーディオタグはrtspまたはrtpをサポートしていますか?そうでない場合、最も簡単な解決策は何でしょうか?おそらく、VLCプラグインなどにドロップダウンします。
回答:
(しかし、実際には...)
HTML 5の<video>
タグはプロトコルにとらわれず、気にしません。プロトコルをsrc
URLの一部として属性に配置します。例えば:
<video src="rtp://myserver.com/path/to/stream">
Your browser does not support the VIDEO tag and/or RTP streams.
</video>
または多分
<video src="http://myserver.com:1935/path/to/stream/myPlaylist.m3u8">
Your browser does not support the VIDEO tag and/or RTP streams.
</video>
とはいえ、 <video>
タグはブラウザ固有です。HTML 5はまだ始まったばかりなので、サポートが頻繁に変更される(またはサポートが不足する)と思います。
W3CのHTML5仕様(ビデオ要素)から:
ユーザーエージェントは、ビデオおよびオーディオのコーデックとコンテナ形式をサポートします。
GET rtp://239.255.0.1:6970 net::ERR_UNKNOWN_URL_SCHEME
。video
要素ではHTTP [S]スキームのみが許可されているようです。
質問の精神は本当に答えられなかったと思います。いいえ、現時点ではビデオタグを使用してrtspストリームを再生することはできません。リンクされたスレッド/回答は、ビデオタグを介してrtspを再生するChromeを直接参照していないため、Chromiumの人の「決して」へのリンクに関する他の回答は少し誤解を招くものです。リンクされたスレッド全体、特に一番下のコメントと他のスレッドへのリンクを読んでください。
本当の答えはこれです。いいえ、html 5ページにvideoタグを付けてrtspを再生することはできません。ストリーミングビデオを再生するには、何らかのフラッシュライブラリ(SilverlightプレーヤーやSilverlightプレーヤーを使用したい場合を除く)のJavaScriptライブラリを使用する必要があります。{IMHO} html 5ビデオのディスカッションと実装が進んでいるレートで、プロプライエタリビデオ標準のさまざまなベンダーはこの前進を支援することに関心がないので、ブラウザーメーカー以外はビデオタグの使いやすさを考慮しないでください。何らかの形で問題を解決するために自分自身でそれを実行してください...おそらく、そうではありません。{/ IMHO}
これは古い質問ですが、私は最近自分でやらなければならなかったので、うまくいくようになりました(私のような応答に加えて、時間を節約できます):基本的にffmpegを使用してコンテナーをHLSに変更し、ほとんどのIPCamsストリームh264といくつかPCMの基本的なタイプなので、次のようなものを使用します。
ffmpeg -v info -i rtsp://ip:port/h264.sdp -c:v copy -c:a copy -bufsize 1835k -pix_fmt yuv420p -flags -global_header -hls_time 10 -hls_list_size 6 -hls_wrap 10 -start_number 1 /var/www/html/test.m3u8
次に、HLSプラグインでvideo.jsを使用しますこれにより、ライブストリームが適切に再生されます。2番目のリンクの下にjsfiddleの例もあります)。
注:これはネイティブサポートではありませんが、ユーザーのフロントエンドに追加の機能は必要ありません。
ffmpeg -v info -rtsp_transport tcp -i rtsp://host:port/[sdp] -c:v copy -c:a copy -maxrate 400k -bufsize 1835k -pix_fmt yuv420p -flags -global_header -hls_time 10 -hls_list_size 6 -hls_wrap 10 -start_number 1 /var/www/html/test.m3u8
ffmpeg.exe -fflags nobuffer -rtsp_transport tcp -i rtsp://[SOURCE] -flags +cgop -g 30 -hls_flags delete_segments [DESTINATION]
HTML5には、3つのストリーミングプロトコル/テクノロジーがあります。
ライブストリーミング、低遅延-WebRTC-Websocket
VODおよびライブストリーミング、高遅延-HLS
1. WebRTC
実際、WebRTCはSRTP(セキュアRTPプロトコル)です。したがって、ビデオタグはWebRTCを介して間接的にRTP(SRTP)をサポートしていると言えます。
したがって、Chrome、Firefox、または別のHTML5ブラウザーでRTPストリームを取得するには、ブラウザーにSRTPストリームを配信するWebRTCサーバーが必要です。
2. WebSocket
これはTCPベースですが、HLSよりレイテンシが低くなります。ここでも、Websocketサーバーが必要です。
3. HLS
VOD(録画済みビデオ)用の最も人気のある高遅延ストリーミングプロトコル。
VLCを使用すると、ライブRTSPストリーム(mpeg4)をOGG形式(Vorbis / Theora)のHTTPストリームにトランスコードできます。品質は悪いですが、ビデオはChrome 9で動作します。WEBM(VP8)でのトランスコーディングもテストしましたが、動作しないようです(VLCにはオプションがありますが、今のところ実際に実装されているかどうかはわかりません。 。)
これに関するドキュメントを最初に持っている人は私たちに通知する必要があります;)
"C:\Program Files\VideoLAN\VLC\vlc.exe" -I dummy screen:// :screen-fps=16.000000 :screen-caching=100 :sout=#transcode{vcodec=theo,vb=800,scale=1,width=600,height=480,acodec=mp3}:http{mux=ogg,dst=127.0.0.1:8080/desktop.ogg} :no-sout-rtp-sap :no-sout-standard-sap :ttl=1 :sout-keep
-これは、入力(画面キャプチャデバイスなど)を特定の出力ストリーム(例:127.0.0.1 : 8080/desktop.ogg)にストリーミングするVLCコマンドです
<video id="video" src="http://localhost:8080/desktop.ogg" autoplay="autoplay">
。
my_ip:port
アドレスでHTTPプロトコルを介してオーディオとビデオの両方をストリーミングするようにVLCを設定し<video>
、次のようにHTML5 タグを使用しました<video width="640"><source src="http://my_ip:port/test" type="video/ogg">HTML5 not supported</video>
。
HTML 5ビデオタグとrtsp(rtp)ストリームに関する私の観察は、それはkonqueror(KDE 4.4.1、Phonon-backendがGStreamerに設定されている)でのみ機能するということです。H.264 / AAC RTSP(RTP)ストリームでビデオのみ(オーディオなし)を取得しました。
http://media.esof2010.org/からのストリームは、konqueror(KDE 4.4.1、Phonon-backendがGStreamerに設定されている)では機能しませんでした。
ChromeはサポートRTSPストリーミングを実装していません。WebRTCをチェックする重要なプロジェクト。
「WebRTCは無料のオープンプロジェクトで、ブラウザやモバイルアプリケーションにシンプルなAPIを介してリアルタイムコミュニケーション(RTC)機能を提供します」
サポートされているブラウザ:
Chrome、Firefox、Opera。
サポートされているモバイルプラットフォーム:
AndroidおよびIOS