Video.js使用指南

简介: Video.js使用指南

1.引入JS和CSS包直接撸!


复制代码
2.在HTML中放入容器,这里选择通过JS控制。
html:

To view this video please enable JavaScript, and consider upgrading to a web browser that s upports HTML5 video


复制代码
JS:

复制代码

3.关于动态设置播放URL:
//视频配置

        player = videojs(document.getElementById('myVideo'), {
            sources:[ // 视频源
                {
                    src: 'rtmp://192.168.168.10:1935/live/room1226752779',
                    type: 'rtmp/flv',
                }
            ]
        })
    var data = {
                // src: res.result[1].rtmpUrl,
                // src:"rtmp://192.168.168.10:1935/live/room1508839421",
                src:res.result[1].rtmpUrl,
                type: 'rtmp/flv'
            }
    player.src(data)
    player.load(data)

复制代码

转自:https://segmentfault.com/a/1190000018914486?utm_source=tag-newest
作者: Bill 本文地址: http://biaoblog.cn/info?id=1571103960000

版权声明: 本文为原创文章,版权归 biaoblog 个人博客 所有,欢迎分享本文,转载请保留出处,谢谢!

相关文章
|
25天前
|
存储 编解码 前端开发
React 视频上传组件 Video Upload
随着互联网的发展,视频内容在网站和应用中愈发重要。本文探讨如何使用React构建高效、可靠的视频上传组件,涵盖基础概念、常见问题及解决方案。通过React的虚拟DOM和组件化开发模式,实现文件选择、进度显示、格式验证等功能,并解决跨域请求、并发上传等易错点。提供完整代码案例,确保用户能顺畅上传视频。
128 92
|
9月前
|
前端开发 JavaScript PHP
解决在页面中无法获取qrcode.js生成的base64的图片
该文档介绍了如何解决在部分安卓手机上无法正确加载二维码图片的问题。之前的方法是使用qrcode.js生成二维码,然后与背景图结合用canvas绘制海报,但在某些安卓设备上遇到onload事件不触发的问题。
165 2
uniapp使用weiview引入本地Html5+ video 基于mui 5+的 视频播放器
uniapp使用weiview引入本地Html5+ video 基于mui 5+的 视频播放器
|
视频直播 内存技术
【视频直播篇三】vue-cli3集成vue-video-player
本文着重介绍vue-cli3集成vue-video-player
526 0
|
Web App开发 移动开发 编解码
flv.js 学习
这次有个项目要使用到flv.js,是我以前从未接触过的知识,边学边做吧
177 0
|
存储 移动开发 JavaScript
Video.js 使用教程 - 手把手教你基于 Vue 搭建 HTML 5 视频播放器
Video.js 是最强大的网页嵌入式 HTML 5 视频播放器的组件库之一,也是大多数人首选的网页视频播放解决方案。复杂的网页视频渲染,在引入 Video.js 后,轻松解决。本教程手把手教你搭建一套基于 Vue 的 Video.js 视频播放页。 跟随本教程学习,最终你可以自己搭建一套可以播放本地视频文件及网络流媒体的网页视频播放器。学习如何修改 video.js 的默认样式来实现播放按钮自定义形状(圆形)、居中及播放时间的显示与否, 如何播放 m3u8 格式,以及如何使用 video 的属性、事件及方法,音量增减,最终实现一个功能齐全的视频播放器。
1015 0
|
JavaScript 前端开发 Android开发
DPlayer.js视频播放插件使用方法
这篇文章主要为大家详细介绍了JSx实现简单控制视频播放倍速,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
1990 0
网页视频播放器(easyplayer和vue-video-player的使用)
网页视频播放器(easyplayer和vue-video-player的使用)1. 两种方式实现的网页播放器 2. 支持的视频格式不太相同
网页视频播放器(easyplayer和vue-video-player的使用)

热门文章

最新文章