3

问题

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

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

我试过的

测试的设备和浏览器：

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

问题

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

4

4 回答 4

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);
    }   
});
于 2016-05-12T10:49:34.157 回答
0

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

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

于 2016-05-11T09:12:16.500 回答
0

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

于 2016-05-18T22:32:34.330 回答
0

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

于 2016-05-11T09:25:13.663 回答