这是我参与「第四届青训营 」笔记创作活动的的第26天

基础知识

2.封装格式

• 封装格式
  • 存储音视频、图片或字幕信息的一种容器
  • audio标签和video标签的缺陷
    • 不支持直接播放hls、flv等视频格式
    • 视频资源的请求和加载无法通过代码控制
      • 分段加载（节约流量）
      • 清晰度无缝切换
      • 精确预加载

3.多媒体元素和扩展API

• 媒体源扩展API（Media Source Extensions）
  • 无插件在web端播放流媒体
  • 支持播放hls、flv、mp4等格式视频
  • 可实现视频分段加载、清晰度无缝切换、自适应码率、精确预加载等
• 播放器播放流程
• mp4和fmp4

4.流媒体协议

HLS全称是HTTP Live Streaming，是一个由Apple提出的基于HTTP的媒体流传输协议，用于实时音视频流的传输，目前HLS协议被广泛的应用于视频点播和直播领域

应用场景

• 点播：各大视频网站的视频，流程：视频上传-视频转码（转成1080p等等）-分发到CDN（拉流）
• 云游戏：所有程序运行在远端，打开云游戏会向远端发布指令，然后远端发回一个视频流
• 视频编辑：在web端进行视频编辑

总结与展望

• flash → H5 vieo → MSE
• 编码格式、封装格式、多媒体元素、流媒体协议
• 新技术标准
  • Webassembly，更好兼容H.265解码
  • Webcodecs，前端更方便地进行视频和音频解码
  • WebGPU，第二代WebGL
  • WebVR、WebXR，主要用于元宇宙