HTML5直播 [英] HTML5 live streaming

查看:154
本文介绍了HTML5直播的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

对于学校,我需要设置HTML5直播网站。他们有一个他们一直在使用的Flash流媒体播放器,但现在他们希望它使用HTML5。我怎样才能做到这一点?我试图使用视频标签,但我无法得到它的工作。以下是我的代码。有人能指出我正确的方向吗?

 <!DOCTYPE html> 
< html lang =en>
< head>
< meta http-equiv =Content-Typecontent =text / html; charset = utf-8/>
< title> Deltion Live Streaming< / title>
< script language =javascripttype =text / javascriptsrc =../ swfobject.js>< / script>
< / head>

< body>

< video id =moviewidth =460height =306preload autoplay>
< source src =rtmp://fl2.sz.xlcdn.com:80 / sz = Deltion_College = lb1type ='video / mp4; codecs =avc1.42E01E,mp4a.40.2'>
<! - 这里是替代球员(闪电)的代码! - >
< / video>
< / body>
< / html>


解决方案

可能的替代方案:


  1. 使用编码器(例如VLC或FFmpeg)将输入流
    打包为OGG格式。例如,在这种情况下,我使用VLC将
    屏幕捕获设备打包为此代码:


    C:\Program Files \视频LAN \ VLC \ vlc.exe -I虚拟屏幕://
    :screen-fps = 16.000000:screen-caching = 100
    :sout = #transcode {vcodec = theo,vb = 800,scale = 1,width = 600,height = 480,acodec = mp3}:http {mux = ogg,dst = 127.0.0.1:8080 / desktop.ogg}
    :no-sout-rtp-sap: no-sout-standard-sap:ttl = 1:sout-keep



  2. 将此代码嵌入<$ c $在您的HTML页面中添加< video> 标签:

    < video id =video src =http:// localhost:8080 / desktop.oggautoplay =autoplay/>


这应该可以做到。然而,这是一种糟糕的表现,AFAIK MP4容器类型应该比OGG更好地支持浏览器。


For school I need to set up an HTML5 live stream site. They have a flash stream-player they've been using but now they want it to use HTML5 instead. How can I do this? I tried using the video tag but I can't get it working. Below is the code I have. Could someone point me in the correct direction?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Deltion Live Streaming</title>
    <script language="javascript" type="text/javascript" src="../swfobject.js"></script>
</head>

<body>  

    <video id="movie" width="460" height="306" preload autoplay>
        <source src="rtmp://fl2.sz.xlcdn.com:80/sz=Deltion_College=lb1"  type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
            <!-- HERE THE CODE FOR THE ALTERNATIVE PLAYER (FLASH) WILL BE! -->
    </video>
</body>
</html>

解决方案

A possible alternative for that:

  1. Use an encoder (e.g. VLC or FFmpeg) into packetize your input stream to OGG format. For example, in this case I used VLC to packetize screen capture device with this code:

    C:\Program Files\VideoLAN\VLC\vlc.exe -I dummy screen:// :screen-fps=16.000000 :screen-caching=100 :sout=#transcode{vcodec=theo,vb=800,scale=1,width=600,height=480,acodec=mp3}:http{mux=ogg,dst=127.0.0.1:8080/desktop.ogg} :no-sout-rtp-sap :no-sout-standard-sap :ttl=1 :sout-keep

  2. Embed this code into a <video> tag in your HTML page like that:

    <video id="video" src="http://localhost:8080/desktop.ogg" autoplay="autoplay" />

This should do the trick. However it's kind of poor performance and AFAIK MP4 container type should have a better support among browsers than OGG.

这篇关于HTML5直播的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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