前端如何播放flv视频

1、引入js

<script src="https://cdn.bootcdn.net/ajax/libs/flv.js/1.6.2/flv.min.js"></script>

2、核心代码

<script>

if (flvjs.isSupported()) {

var videoElement = document.getElementById('videoElement');

var flvPlayer = flvjs.createPlayer({

type: 'flv', //媒体类型,flv 或 mp4,默认 flv

isLive: true, // 开启直播

hasAudio: false, //是否有音频,需要设置为false不然播放不了视频

cors: true, // 开启跨域访问

url: 'http://192.168.88.80:8081/live/aa.flv'

},

{

enableWorker: false, //不启用分离线程

enableStashBuffer: false, //关闭IO隐藏缓冲区

reuseRedirectedURL: true, //重用301/302重定向url,用于随后的请求,如查找、重新连接等。

autoCleanupSourceBuffer: true //自动清除缓存

}

);

flvPlayer.attachMediaElement(videoElement);

flvPlayer.load();

flvPlayer.play();

// flvPlayer.stop();

}

</script>

3、页面直接用video 标签即可,详情可参考:http://www.yayihouse.com/yayishuwu/chapter/4510

相关推荐
weixin_436525075 小时前
若依多租户版: 页面新增菜单, 执行菜单SQL
前端·数据库·sql
FITA阿泽要努力5 小时前
Agent Engineer-Day 1 初始智能体与大语言模型基础
java·前端·javascript
霸王蟹6 小时前
Uni-app 跨端开发框架Unibest快速体验
前端·笔记·微信·uni-app·unibest
zihan03216 小时前
element-plus, el-table 表头按照指定字段升降序的功能实现
前端·vue.js·状态模式
三翼鸟数字化技术团队6 小时前
watchEffect的两种错误用法
前端·javascript·vue.js
局外人LZ6 小时前
Decimal.js 完全指南:解决前端数值精度痛点的核心方案
开发语言·前端·javascript
郑州光合科技余经理6 小时前
同城配送调度系统实战:JAVA微服务
java·开发语言·前端·后端·微服务·中间件·php
一只小bit6 小时前
Qt 绘图核心教程:从基础绘制到图像操作全解析
前端·c++·qt·gui
乾元7 小时前
绕过艺术:使用 GANs 对抗 Web 防火墙(WAF)
前端·网络·人工智能·深度学习·安全·架构
HWL56797 小时前
一个CSS属性will-change: transform
前端·css