直播流地址

rtmp://live.hkstv.hk.lxdns.com/live/hks

 

API 接口

(一)   Modules  模块

1)         browser ：浏览器

2)         buffer ：缓冲

3)         computed-style ：计算风格

4)         dom ：文档对象模型

5)         dom-data ：文档数据

6)         evented ：事件化

7)         events ：事件系统

8)         extend ：扩展

9)         filter-source ：过滤资源

10)     fn ：函数

11)     Format-time ：格式化时间

12)     Guid ：唯一id

13)     Log ：日志

14)     merge-options ：融合选项

15)     obj ：对象

16)     setup ：设置

17)     stateful ：有状态

18)     stylesheet ：样式表

19)     text-track-list-converter ：文本轨道李彪转换器

20)     time-ranges ：时间范围

21)     to-title-case ：首字母大写

22)     url ：网址

23)     videojs ：videojs方法

 

(二)   Classes ：类

1. AudioTrack ：声道
2. AudioTrackButton ：声道按钮
3. AudioTrackList ：声道列表
4. AudioTrackMenuItem ：声道菜单项
5. BigPlayButton ：大播放按钮
6. Button ：按钮
7. CaptionsButton ：字母按钮
8. CaptionSettingsMenuItem ：字母设置菜单项
9. ChaptersButton ：章节按钮
10. ChaptersTrackMenuItem ：章节轨道菜单项
11. ClickableComponent ：可点击组件
12. CloseButton ：关闭按钮
13. Component ：组件
14. ControlBar ：控制条
15. CurrentTimeDisplay ：当前时间展示
16. CustomControlSpacer ：自定义控制间隔
17. DescriptionsButton ：说明按钮
18. DurationDisplay ：持续时间显示
19. ErrorDisplay ：错误显示
20. EventTarget ：事件目标
21. FullscreenToggle ：全屏切换
22. Html5 ：html5媒体控制
23. HTMLTrackElement ：html轨道元素
24. HtmlTrackElementList ：html轨道元素列表
25. LiveDisplay ：直播显示
26. LoadingSpinner ：加载旋转器
27. LoadProgressBar ：加载进度条
28. MediaError ：媒体错误
29. MediaLoader ：媒体加载器
30. Menu ：菜单
31. MenuButton ：菜单按钮
32. MenuItem ：菜单项
33. ModalDialog ：模态对话框
34. Log ：日志
35. videojs.AudioTrack ：声道
36. videojs.EventTarget ：事件目标
37. videojs.TextTrack ：文本轨道
38. videojs.VideoTrack ：视频轨道
39. MouseTimeDisplay ：鼠标时间显示
40. MuteToggle ：静音切换
41. OffTextTrackMenuItem ：关闭文本轨道菜单项
42. PlaybackRateMenuButton ：播放速率菜单按钮
43. PlaybackRateMenuItem ：播放速率菜单项
44. Player ：播放器
45. PlayProgressBar ：播放进度条
46. PlayToggle ：播放切换
47. Plugin ：插件
48. Popup ：弹出组件
49. PopupButton ：弹出按钮
50. PosterImage ：海报图片
51. ProgressControl ：进度控制组件
52. RemainingTimeDisplay ：剩余时间显示
53. SeekBar ：拖动条
54. Slider ：滑块
55. Spacer ：间隔元素
56. SubtitlesButton ：字幕按钮
57. Tech ：控制使用的技术
58. TextTrack ：文本轨道
59. TextTrackButton ：文本轨道按钮
60. TextTrackCueList ：文本轨道提示列表
61. TextTrackDisplay ：文本轨道显示
62. TextTrackList ：文本轨道列表
63. TextTrackMenuItem ：文本轨道菜单项
64. TextTrackSettings ：文本轨道设置
65. TimeDivider ：时间分割器
66. TimeTooltip ：时间提示
67. Track ：轨道
68. TrackButton ：轨道按钮
69. TrackList ：轨道列表
70. VideoTrack ：视频轨道
71. VideoTrackList ：视频轨道列表

　  72.VolumeBar ：音量栏

包含音量级别的栏，可以单击以调整级别

Members

72.1       playerEvent :string

当播放器发生此事件时，调用此滑块的更新事件。

Methods

72.2       calculateDistance(event) → {number}

计算滑块距离

72.3       checkMuted()

如果播放器静音就取消静音

72.4       createEl() → {Element}

创建组件的dom元素

72.5       getPercent() → {number}

获取音量的百分比

72.6       handleBlur(event)

处理此滑块上的触发事件

72.7       handleClick(event)

滑块上的点击事件的侦听器，用于防止点击冒泡到像按钮菜单这样的父元素。

72.8       handleFocus(event)

处理此滑块上的焦点事件

72.9       handleKeyPress(event)

处理此滑块上的按键事件，监视上、下、左、右箭头按键，此函数仅在滑块具有焦点是被调用

72.10   handleMouseDown(event)

处理滑块上的mousedown或touchstart事件

72.11   handleMouseMove(event)

处理VolumeMenuButton上的鼠标移动事件

72.12   handleMouseUp(event)

72.13   处理滑块上的mouseup或touchend事件。

72.14   stepBack()

降低键盘用户的音量

72.15   stepForward()

提高键盘用户的音量

72.16   update() → {number}

更新滑块的进度条。

72.17   updateARIAAttributes(eventopt)

更新ARIA辅助功能属性

72.18   vertical(boolopt) → {boolean}

获取或设置滑块为水平或者垂直

Events

72.19   slideractive

当滑块处于活动状态时触发

72.20   Sliderinactive

当滑块不再处于活动状态时触发。

 

73.VolumeControl ：音量控制组件

74.VolumeLevel ：音量层级

75.VolumePanel ：音量面板

 

(三)   Mixins ：混合器

 

1)         EventedMixin ：事件混合器

2)         StatefulMixin ：状态混合器

 

 

Guides 向导

1)         audio-tracks ：音轨

音频轨道是HTML5视频的特征，用于向用户提供替代音轨选择，使得可以播放除主轨道之外的轨道。 Video.js提供了跨浏览器的音轨实现。

1.1          注意

 

2)         Components ：组件

Video.js播放器的架构围绕组件。 Player类和表示播放器控件和其他UI元素的所有类继承自Component类。 这种架构使得可以轻松地以反映DOM的树状结构构建Video.js播放器的用户界面。

2.1          什么是组件？

组件是具有以下功能的JavaScript对象：

 

• 相关联的DOM元素。
• 与Player对象的关联。
• 能够管理任意数量的子组件。
• 监听和触发事件的能力。
• 初始化和处置的生命周期。

 

有关组件的编程接口的更多详细信息，请参阅组件API文档。

2.2          创建组件

Video.js组件可以继承并注册到Video.js以向播放器添加新功能和UI。

对于一个工作示例，我们有一个JSBin演示创建一个组件，用于在播放器顶部显示标题。

此外，有几种方法值得认可：

 

l  videojs.getComponent（String name）：从Video.js检索组件构造函数。

l  videojs.registerComponent（String name，Function Comp）：使用Video.js注册组件构造函数。

l  videojs.extend（Function component，Object properties）：提供原型继承。 可用于扩展组件的构造函数，返回具有给定属性的新构造函数

2.3          子组件

同样，请参阅组件API文档，以获取有关管理组件结构的方法的完整详细

2.3.1     基本示例

当子组件添加到父组件时，Video.js将子组件插入到父组件的元素中

相反，删除子组件将从DOM中删除子组件的元素：

2.3.2     使用选项

传递儿童构造器的选项和子代的子选项。

当组件初始化时，也可以通过选项添加子项。

注意：包括一个'name'键，如果两个相同类型的子组件需要不同的选项，将使用它。

2.4          事件监听

2.4.1     使用on

myFunc的上下文将是myComponent，除非它被绑定。 您可以将侦听器添加到另一个元素或组件。

2.4.2     使用off

如果myFunc被排除，事件类型的所有侦听器将被删除。 如果eventType被排除，所有侦听器将从组件中删除。 您可以使用off来删除添加到其他元素或组件的侦听器：

 

myComponent.on（otherComponent ...

 

在这种情况下，事件类型和侦听器函数都是REQUIRED。

2.4.3     使用one

您还可以将侦听器添加到将只触发一次的另一个元素或组件。

2.4.4     使用trigger

2.5          默认组件

Video.js播放器的默认组件结构如下所示

2.6          特定组件详细信息

2.6.1     Volume Panel 音量面板

VolumePanel包括MuteToggle和VolumeControl组件，如果不支持声音更改，它将被隐藏。 VolumePanel有一个重要的选项，它可以使您的VolumeControl在MuteToggle上垂直显示。 这可以通过传递VolumePanel {inline：false}来设置，因为默认行为是设置为{inline：true}的水平VolumeControl

2.6.2     文本轨道设置

文本轨道设置组件仅在使用模拟文本轨道时可用。

 

 

3)         Debugging ：调试

Video.js包含一个轻量级封装器 - videojs.log - 围绕控制台API的一个子集。 可用的方法是videojs.log，videojs.log.warn和videojs.log.error。

3.1          API Overview ：API概述

大多数这些方法应该是相当一目了然的，但有关完整的详细信息，请参阅API文档。

有关这些功能的说明，请参阅以下部分。

3.2          Log Safely ：安全记录

与控制台不同，可以在代码中保留videojs.log调用。 当控制台不存在时，它们不会抛出错误。

3.3          Log Objects Usefully ：日志对象有效

与控制台类似，任何数量的混合类型值都可以传递给videojs.log方法：

但是，某些浏览器控制台（即IE10和更低版本）不支持非字符串值。 Video.js通过在IE10及更低版本中记录对象之前传递对象通过JSON.stringify改善了这种情况。 换句话说，代替上述产生：

3.4          Log Levels ：日志级别

与控制台不同，videojs.log包括日志级别的概念。 这些级别打开或关闭日志记录方法。

通过videojs.log.level方法公开级别。 此方法同时作为当前日志记录级别的getter和setter。 没有参数，它返回当前日志记录级别：

通过传递字符串，日志记录级别可以更改为可用的日志记录级别之一：

3.5          Available Log Levels ：可用日志级别

3.5.1     all（默认）：启用所有日志记录方法

3.5.2     error：仅显示log.error消息

3.5.3     off：禁用所有日志记录方法

3.5.4     warn：仅显示log.warn和log.error消息

3.6          History ：历史

注意：在Video.js 5中，videojs.log.history是一个数组。 从Video.js 6开始，它是一个返回数组的函数。 进行此更改是为了提供更丰富，更安全的日志记录API。

默认情况下，videojs.log模块跟踪传递给它的所有内容的历史记录，而不考虑日志记录级别：

即使日志记录设置为关闭，这也将工作。

这可能是有用的，但它也可能是内存泄漏的来源。 例如，记录的对象将被保留在历史中，即使引用在其他地方被删除！

为了避免这个问题，可以通过方法调用来禁用或启用历史记录（分别使用disable和enable方法）。 停用历史记录非常简单：

最后，历史记录（如果启用）可以随时通过以下方式清除：

 

4)         event-target ：事件目标

设置video.js中的事件，以便它们模仿对象上使用的DOM API，但也具有相同功能的有用的速记功能

5)         Faq ：问答

6)         Hooks ：钩子

6.1          存在挂钩，以便用户可以“挂钩”某些video.js播放器生命周期

7)         Languages ：语言

7.1          多语言支持允许非英语区域设置的用户与Video.js播放器进行本地交互。

8)         modal-dialog ：模态对话框

8.1          ModalDialog组件是Video.js核心的一部分，为完整播放器覆盖提供了一个定制的UI。

9)         Options ：选项

9.1          注意：本文档仅作为可用选项的参考。 要了解将选项传递给Video.js，请参阅设置指南。

10)     player-workflows ：播放器工作流

10.1       本文档概述了使用Video.js进行高级播放器工作流程时的许多注意事项。 请务必先阅读设置指南！

11)     Plugins ：插件

11.1       Video.js的一个强大的优势是它的插件生态系统，允许来自世界各地的作者分享他们的视频播放器自定义。 这包括从最简单的UI调整到新的播放技术和源处理程序的一切！

12)     React ：reactJs上的应用

13)     Setup ：设置

14)     Skins ：皮肤

15)     Tech ：播放技术

16)     text-tracks ：文本轨道

17)     tracks ：轨道

18)     troubleshooting ：故障排除

19)     video-tracks ：视频轨道

20)     videojs ：