IPカメラからHLSにストリーミングするサーバー(nginx-rtmp-module)があります。 Chrome、Firefox、IEなどの人気のあるブラウザにライブストリームを埋め込みたいです。
一部のデスクトップブラウザでは、ストリームが機能していません。
テスト済みのデバイスとブラウザ:
これらの問題を解決する方法は?フラッシュはデスクトップブラウザでのライブHLSストリーミングの要件ですか?
Jwpplayerのサポートといくつかのソースコードの掘り下げに連絡した後、私はいくつかの事実を理解しました。
Flashは必ずしもライブストリーミングの要件ではありませんが、現在ChromeおよびFirefox(IEに加えて)でのHLS再生の要件です。Chromeには独自の組み込みバージョンのFlashであるため、意図的に無効にしない限り、Flash PlayerをダウンロードしてインストールしなくてもHLSストリームを再生できます。ただし、FirefoxとIEにはFlashPlayerが必要です。インストールされています。
私のマシンではIE 11は機能していましたが、Firefoxは「プレーヤーの読み込みエラー:再生可能なソースが見つかりません」というメッセージで失敗しました(Flashプラグインがないため)。そこで、正しいメッセージを表示するためにJavaScriptを追加しました。
これが機能するには、swfobject.jsライブラリが必要です: http://github.com/swfobject/swfobject
jwplayer.key="<<-THE-KEY->>";
var player = jwplayer("video_container").setup({
file: "http://domain.lt/live/stream.m3u8",
androidhls: true,
width: '100%',
aspectratio: '16:9',
autostart: 'true',
stretching: 'fill'
});
player.onSetupError(function(error)
{
if (swfobject.getFlashPlayerVersion().major == 0)
{
var message = 'Flash is missing. Download it from <a target="_blank" href="http://get.Adobe.com/flashplayer/" class="underline">Adobe</a>. (uncheck "McAfee Security Scan Plus" and "True Key™ by Intel Security" )</p>';
$("#video_container").hide();
$("#video_callout").html(message);
} else
{
var message = '<p>Your device is not supported. Please visit this page on another PC or Phone.</p>';
$("#video_container").hide();
$("#video_callout").html(message);
}
});
コンテンツが混在しているために失敗しているようです。 httpsにページがありますが、jwplayerのURLはhttpにあります。
すべてをhttpsの下に置いて、もう一度やり直してください。
しばらく前に取り組んできたプロジェクトの1つで同じ問題が発生しました。 RTMPをサポートしていないブラウザの問題を解決するために、MP4ファイルでフォールバックソースを追加しました。
sources: [{
file: "rtmp://example.com/application/mp4:myVideo.mp4"
},{
file: "https://example.com/assets/myVideo.mp4"
}]
ドキュメント: https://support.jwplayer.com/customer/portal/articles/1430358-using-rtmp-streaming
使用しているプレーヤーによって異なる場合があります。私はこれまでFlowplayerで幸運に恵まれ、FlashPlayerプラグインなしでライブストリームを再生できましたChrome(代わりに、MSEを使用してHLSストリームをレンダリングします)。同じ結果Windows 10でIE11を使用しますが、Windows 7マシンでは、HLSストリームはAdobe Flash Playerによってレンダリングされました(以前のバージョンのIEの場合と同様)。Firefoxには引き続き問題があります。v45はMSEをサポートしていますが、HLSを適切に処理できませんでした。フラグメントの読み込みエラーが原因です。この問題は以前に特定されているようで、近いうちに解決されることを願っています。