在本节中,您将学习如何使用 <video>
和 <source>
标记将媒体文件嵌入网页,如何为听力障碍人士的视频添加字幕,以及使用媒体框架的一些通用概念。此外,您还将学习如何使用 preload 加速播放开始,并且我们将讨论如何构建具有离线自适应流媒体功能(名为 Kino)的更新演示 PWA。
本节假设您有一个准备好嵌入网页的视频文件。从相机下载的 .mov
文件将不起作用。如果这就是您所拥有的,请参阅为 Web 准备媒体文件,然后再返回。
本节涵盖以下主题。
- 在
<video>
和<source>
标记中,您将具体学习如何将媒体文件嵌入网页。 - 在媒体无障碍功能中,您将学习为听力障碍人士的媒体文件添加字幕。
- 在媒体框架中,您将学习有关使用 Shaka Player、JW Player 和 Video.js 等媒体框架的基础知识。
- 在通过音频和视频预加载实现快速播放中,您将学习如何通过主动预加载资源来加速媒体播放。
- 在具有离线流媒体功能的 PWA 中,您将了解我们如何构建能够实现自适应流媒体和离线播放而无需框架的更新演示 PWA。此外,您可以体验源代码。
本节有很多内容要介绍,首先学习如何使用 <video>
和 <source>
标记。