全球主机交流论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

CeraNetworks网络延迟测速工具IP归属甄别会员请立即修改密码
查看: 2426|回复: 3

求一个单html文件播放m3u8的源码

[复制链接]
发表于 2018-6-22 09:52:35 | 显示全部楼层 |阅读模式
有一个m3u8的地址,需要用一个页面直接播放出来。越简单越好,哪位大佬有?
发表于 2018-6-22 09:56:28 | 显示全部楼层

https://github.com/video-dev/hls.js/tree/master/demo
发表于 2018-6-22 10:23:17 | 显示全部楼层

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, shrink-to-fit=no">
    <title>播放器例子</title>
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="msapplication-tap-highlight" content="no">
    <!--<meta http-equiv="content-security-policy" content="block-all-mixed-content">-->
    <style>
        body {
            margin: 0;
            padding: 0;
        }
        .vcp-error-tips {
            color: #fff;

        }
        a{
            color: #fff;
        }
    </style>
</head>
<body>
<div id="video-container" style="margin: 0px auto;">
</div>
<!--Polyfill-->
<!--[if lt IE 9]>
<script src="//imgcache.qq.com/open/qcloud/video/vcplayer/libs/es5-shim.js"></script>
<script src="//imgcache.qq.com/open/qcloud/video/vcplayer/libs/es5-sham.js"></script>
<![endif]-->
<script src="//imgcache.qq.com/open/qcloud/video/vcplayer/TcPlayer-2.2.2.js"></script>
<script>
    (function () {
        function getParams(name) {
            var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
            var r = window.location.search.substr(1).match(reg);
            if (r != null) {
                return decodeURIComponent(r[2]);
            }
            return null;
        }

        function getPathParams() {
            var path = location.pathname.split('/');
            if (path[1] == 'vod-player') {
                return {
                    'path': location.origin + path.slice(0, 4).join('/'),
                    'appid': path[2],
                    'fileid': path[3]
                }
            } else {
                return null;
            }
        }

        var rtmp = getParams('rtmp'),
            flv = getParams('flv'),
            m3u8 = getParams('m3u8'),
            mp4 = getParams('mp4'),
            live = (getParams('live') == 'true' ? true : false),
            coverpic = getParams('coverpic'),
            width = getParams('width'),
            height = getParams('height'),
            volume = getParams('volume'),
            flash = (getParams('flash') == 'true' ? true : false),
            h5_flv = (getParams('h5_flv') == 'true' ? true : false),
            autoplay = (getParams('autoplay') == 'true' ? true : false),
            flashUrl = (function () {
                var params = getPathParams();
                if (params) {
                    return params.path + '/player/release/QCPlayer.swf';
                }
                return '//imgcache.qq.com/open/qcloud/video/player/release/QCPlayer.swf'
            })(),
            log = getParams('log');
        /**
         * 视频类型播放优先级
         * mobile :m3u8>mp4
         * PC :RTMP>flv>m3u8>mp4
         */
        var options = {
            rtmp: rtmp,
            flv: flv ,
            m3u8: m3u8 ,
            mp4: mp4 || '//1253668508.vod2.myqcloud.com/e6feb153vodtransgzp1253668508/f2b7e26f7447398155146701990/v.f30.mp4',
            autoplay: autoplay,
            live: live,
            width: width || '480',
            height: height || '320',
            volume: volume || 0.5,
            flash: flash,
            flashUrl: flashUrl,
            h5_flv: h5_flv,
            wording: {
                2032: '请求视频失败,请检查网络',
                2048: '请求m3u8文件失败,可能是网络错误或者跨域问题'
            },
            listener: function (msg) {

            }
        };
        window.tcplayer = new TcPlayer('video-container', options);

    })();
</script>
</body>
</html>
您需要登录后才可以回帖 登录 | 注册

本版积分规则

Archiver|手机版|小黑屋|全球主机交流论坛

GMT+8, 2024-9-21 22:43 , Processed in 0.057008 second(s), 6 queries , Gzip On, MemCache On.

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表