如何在HTML网页中嵌入流式视频（rtmp协议）？

Question

如何在HTML网页中嵌入流式视频（rtmp协议）？

4

我找到了运行自己的rtmp服务器的方法，我还有一个mp4视频。使用VLC可以播放rtmp文件，但我需要在HTML网页中嵌入视频。我看到以下链接：https://www.codeproject.com/Tips/668131/How-to-embed-streaming-Video-rtmp-protocol-in-HTML。但对我无效。我还读到可以使用一个叫做JWPlayer的东西...但我不知道它是如何工作的或者需要遵循哪些步骤来使用它。我知道互联网上有很多关于这个主题的帖子，有人可以给我一个例子吗？（我的意思是HTML代码）谢谢！ Eric.

- Eric Cano

你是对的，抱歉我的信息不够清晰，这是我在这里的第一篇帖子。我会改进我的未来帖子。 - Eric Cano

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Eric Cano · Accepted Answer

最终我解决了我的问题。我必须使用Flowplayer在网站上显示我的rtmp视频。

以下是我遵循的步骤： 1 - 使用wget下载http://releases.flowplayer.org/flowplayer.rtmp/flowplayer.rtmp-3.2.13.swf（放在rtmp服务器上，具体位置为usr/local/nginx/html/）

2 - 打开我创建的html文件，并将其保留如下（在我的情况下是test.html）：

<html>
<head>
    <script src="http://releases.flowplayer.org/js/flowplayer-
      3.2.12.min.js"></script>
</head>

<body>
    <div id="player" style="width:644px;height:276px;margin:0 auto;text-align:center">
        <img src="/path/to/background.png" height="260" width="489" />
    </div>
    <script>
        $f("player", "http://releases.flowplayer.org/swf/flowplayer-
    3.2.16. swf ", {
        clip: {
            url: '<YOUR_FILE.flv>',
            scaling: 'fit',
            provider: 'hddn'
        },

        plugins: {
            hddn: {
                url: "flowplayer.rtmp-3.2.13.swf",

                netConnectionUrl: 'rtmp://<IP_OF_THE_SERVER>:1935/vod'
            }
        },
        canvas: {
            backgroundGradient: 'none'
        }
        });
    </script>
</body>
</html>

3 - 修改 netConnectionUrl 和 url 的值。

4 - 导航到服务器（例如：http://10.11.1.11/test.html）。

这样就可以了！