如何在HTML网页中嵌入流式视频(rtmp协议)? [英] How to embed streaming Video (rtmp protocol) in HTML web page?

查看:1384
本文介绍了如何在HTML网页中嵌入流式视频(rtmp协议)?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我找到了运行自己的rtmp服务器的方法,并且我也有一个mp4视频. 使用VLC,我可以使用rtmp文件,但是我需要将视频嵌入HTML网页. 我看到了以下链接: https://www.codeproject.com/Tips/668131/How-to-embed-streaming-Video-rtmp-protocol-in-HTML . 但是对我没用.

I found the way to run my own rtmp server and I have an mp4 video too. With VLC I can consume the rtmp file but I need to embed the video in an HTML web page. I saw the following link: https://www.codeproject.com/Tips/668131/How-to-embed-streaming-Video-rtmp-protocol-in-HTML. But didn't work for me.

我还读到您可以使用称为JWPlayer的东西.....但我不知道它是如何工作的,或者您需要遵循哪些步骤才能使用它.

I also read that you can use something called JWPlayer.....But I didn't understand how it works or which steps you need to follow for use it.

我知道互联网上有很多关于该主题的帖子,有人可以举个例子吗? (我的意思是HTML代码)

I know there is a lot of post in the internet about this topic , Can anyone give me an example? (i mean HTML code)

提前谢谢!

埃里克.

推荐答案

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

Finally I solved my problem. I had to use Flowplayer to show my rtmp videos on a website.

这是我遵循的步骤:

1 -wget http ://releases.flowplayer.org/flowplayer.rtmp/flowplayer.rtmp-3.2.13.swf (在rtmp服务器上,尤其是在usr/local/nginx/html/中)

1 - wget http://releases.flowplayer.org/flowplayer.rtmp/flowplayer.rtmp-3.2.13.swf (on rtmp server, specifically in usr/local/nginx/html/)

2 -打开我创建的html,并将其保留为这样(在我的情况下为test.html):

2 - Open the html that I create and leave it like this (in my case was 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的值.

3 - Modify the values of the netConnectionUrl, and url.

4 -导航服务器(在我的情况下 http://10.11.1.11 /test.html )

4 - Navigate the server (in my case http://10.11.1.11/test.html)

它有效!.

这篇关于如何在HTML网页中嵌入流式视频(rtmp协议)?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆