如何使用VideoJs播放FLV文件?

时间:2015-05-22 08:14:17

标签: video video.js flv

尝试设置videojs播放视频,但视频通常是外部链接,而不是本地文件。
所有这些都是从一个Feed中读取的,我不知道在没有下载文件的情况下是什么类型的视频,无论是mp4,flv还是其他。我可以尝试使用PHP进行路径扩展,但并非所有URL都包含扩展名。有些可能像:http://example.com/videos/?id=290

<head>我有:

<base href="/">
<script type="text/javascript" src="/js/video.dev.js"></script>
<script>
    videojs.options.flash.swf = "/js/video-js.swf";
</script>

我的HTML是:

<div class="multimedia_video lazy" data-href="#vid-href_78" data-vid-id="vid_78"
    data-vid-src="http://mobile2.swissgeo.ch/neuchatel/imotion/images/videos/creux-du-van.flv"
    data-original="http://mobile2.swissgeo.ch/neuchatel/imotion/images/videos/alt_CreuxduVan.jpg" style="display: block; background-image: url(http://mobile2.swissgeo.ch/neuchatel/imotion/images/videos/alt_CreuxduVan.jpg);">
    <div class="multimedia_title categoryGrey">
        Creux du Van
    </div>

    <div class="hide">
        <div id="vid-href_78" style="width: 100%; height: 100%;">
        </div>
    </div>
</div>

我的JS是:

$('.multimedia_video').colorbox({
    inline: true,
    innerWidth: '95%',
    innerHeight: '40%',
    href: function() {
        return $(this).data('href');
    },
    title: function() {
        return $('.multimedia_title', this).text();
    },
    onLoad: function() {
        var vidId = $(this).data('vid-id');
        var vidImage = $(this).data('original');
        var vidSrc = $(this).data('vid-src');
        var href = $(this).data('href');

        var vidAttrib = {
            'id': vidId,
            'class': 'video-js vjs-default-skin',
            'width': '100%',
            'height': '100%',
            'poster': vidImage,
            'preload': 'auto',
            'data-setup': '{}'
        };
        var vidElem = $('<video/>').attr(vidAttrib);

        var sourceFlv = {
            'src': vidSrc,
            'type': 'video/flv'
        };
        var sourceWebm = {
            'src': vidSrc,
            'type': 'video/webm'
        };
        var sourceMp4 = {
            'src': vidSrc,
            'type': 'video/mp4'
        };

        vidElem.append($('<source/>').attr(sourceFlv));
        vidElem.append($('<source/>').attr(sourceWebm));
        vidElem.append($('<source/>').attr(sourceMp4));
        $(href).html(vidElem);

        videojs.players = {};
        videojs(vidId, {
            language: 'fr',
            techOrder: ["html5", "flash"],
            controls: true,
            autoplay: true,
            preload: "auto"
        }, function() {
        });
    },
    onCleanup: function() {
        var vidId = $(this).data('vid-id');
        videojs(vidId).dispose();
        videojs.players = {};
    }
});

我现在正在使用它,但是我需要videoJs来检查视频是否在HTML中工作然后使用HTML,否则尝试使用Flash播放器...而不是尝试使用HTML,当它失败时它只输出错误。

0 个答案:

没有答案