JWPlayer 和 HLS 流式传输 - “加载播放器时出错：找不到可播放的源”

Question

问题

我有一个服务器 (nginx-rtmp-module) 从 IP 摄像机流式传输到 HLS。 我想将直播嵌入到流行的浏览器：Chrome、Firefox 和 IE。

流无法在某些桌面浏览器上运行。

• 测试玩家：https://content.jwplatform.com/previews/KCpvutTz-FfTLdraP

我尝试了什么

经过测试的设备和浏览器：

• PC 上的 Firefox -“加载播放器时出错：找不到可播放的源”
• IE 11 - 正常
• PC 上的 Chrome - 好的
• Android 上的 Chrome - 好的
• iPhone - 好的

问题

如何解决这些问题？桌面浏览器上的实时 HLS 流式传输是否需要 Flash？

Answer 1

这可能取决于您使用的播放器。到目前为止，我在使用 Flowplayer 时运气不错，并且能够在没有 Chrome 中的 Flash Player 插件的情况下播放实时流（相反，它使用 MSE 来呈现 HLS 流）。在 Windows 10 上使用 IE11 的结果相同，但在 Windows 7 机器上，HLS 流由 Adob​​e Flash Player 呈现（就像在早期版本的 IE 中一样）。 Firefox 仍然存在问题：v45 支持 MSE，但由于片段加载错误而无法正确处理 HLS。看起来这个问题之前已经发现，希望很快能得到解决。

Answer 2

在联系了jwpplayer支持和一些源代码挖掘之后，我弄清楚了一些事实。

Flash 不一定是实时流媒体的要求，但目前它是 Chrome 和 Firefox（除了 IE）中 HLS 播放的要求。 Chrome 有自己的内置 Flash 版本，因此除非故意禁用它，否则它应该播放 HLS 流，而无需下载和安装 Flash Player。但是，Firefox 和 IE 需要安装 Flash Player。

在我的机器上 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);
    }   
});

Answer 3

我在一段时间前从事的一个项目中遇到了同样的问题。为了解决不支持 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

Answer 4

似乎由于内容混合而失败。您的页面在 https 上，但 jwplayer 的 url 在 http 上。

你能把所有的都放在 https 下再试一次吗？