html5支不支持flv文件
这篇文章主要介绍了html5支不支持flv文件的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇html5支不支持flv文件文章都会有所收获,下面我们一起来看看吧。
html5不支持flv格式的文件;video标签原生是不支持flv格式文件的,但是可以通过安装相关的插件来进行支持,flv是“FLASH VIDEO”的简称,FLV流媒体格式是随着“Flash MX”的推出发展而来的视频格式。
本教程操作环境:windows10系统、HTML5版本、Dell G3电脑。
html5支持flv文件吗
HTML5的video标签原生是不支持flv格式文件的,但是可以安装相关插件来进行支持。FLV 是FLASH VIDEO的简称,FLV流媒体格式是随着Flash MX的推出发展而来的视频格式。由于它形成的文件极小、加载速度极快。
目前主流浏览器不能直接嵌入并且播放FLV文件,所以直接用video标签播放是行不通的。
因此提供两种解析方法
嵌入一个swf媒体播放文件,并利用该文件来播放你预设的文件。
这里推荐dplayer(亲测同样好用)
利用B站开源的flv.js,通过将FLV文件流转换为ISO BMFF(Fragmented MP4)段,然后通过Media Source Extensions API 将mp4段提供给HTML5 元素。
flv.js是支持在 HTML5 视频中播放 FLV 格式视频的 JavaScript 库。使用 ES6 编写的,如果低版本兼容需要通过 Babel编译一下
这里仅展示实现demo
安装
npm install --save flv.js
元素
<template> <div> <video id="videoElement" controls autoplay muted width="300px" height="200px"> </video> <button @click="play">播放</button> </div> </template>
代码
import flvjs from 'flv.js' export default { data () { return { flvPlayer:null } }, mounted() { if (flvjs.isSupported()) { var videoElement = document.getElementById('videoElement'); this.flvPlayer = flvjs.createPlayer({ type: 'flv', isLive: true, hasAudio: false, url: 'http://1011.hlsplay.aodianyun.com/demo/game.flv' }); this.flvPlayer.attachMediaElement(videoElement); this.flvPlayer.load(); this.flvPlayer.play(); } }, methods:{ play () { this.flvPlayer.play(); } } }
关于“html5支不支持flv文件”这篇文章的内容就介绍到这里,感谢各位的阅读!相信大家对“html5支不支持flv文件”知识都有一定的了解,大家如果还想学习更多知识,欢迎关注蜗牛博客行业资讯频道。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:niceseo99@gmail.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。
评论