web-dev-qa-db-ja.com

JWPlayerおよびHLSストリーミング-「プレーヤーの読み込みエラー:再生可能なソースが見つかりません」

問題

IPカメラからHLSにストリーミングするサーバー(nginx-rtmp-module)があります。 Chrome、Firefox、IEなどの人気のあるブラウザにライブストリームを埋め込みたいです。

一部のデスクトップブラウザでは、ストリームが機能していません。

私が試したこと

テスト済みのデバイスとブラウザ:

  • PC上のFirefox-「プレーヤーの読み込みエラー:再生可能なソースが見つかりません」
  • IE 11-OK
  • PC上のChrome-OK
  • Chrome on Android-OK
  • iPhone-OK

質問

これらの問題を解決する方法は?フラッシュはデスクトップブラウザでのライブHLSストリーミングの要件ですか?

3
gpson

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);
    }   
});
2
gpson

コンテンツが混在しているために失敗しているようです。 httpsにページがありますが、jwplayerのURLはhttpにあります。

すべてをhttpsの下に置いて、もう一度やり直してください。

0
Jorge

しばらく前に取り組んできたプロジェクトの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

0
Taras

使用しているプレーヤーによって異なる場合があります。私はこれまでFlowplayerで幸運に恵まれ、FlashPlayerプラグインなしでライブストリームを再生できましたChrome(代わりに、MSEを使用してHLSストリームをレンダリングします)。同じ結果Windows 10でIE11を使用しますが、Windows 7マシンでは、HLSストリームはAdobe Flash Playerによってレンダリングされました(以前のバージョンのIEの場合と同様)。Firefoxには引き続き問題があります。v45はMSEをサポートしていますが、HLSを適切に処理できませんでした。フラグメントの読み込みエラーが原因です。この問題は以前に特定されているようで、近いうちに解決されることを願っています。

0
webcast33