如何使用流媒体服务器在 HTML5 页面播放视频和直播？

随着网络提速和手机性能的提高，移动端页面中出现视频内容的频率愈来愈高。HTML5 经过 video 标签来支持嵌入式的媒体文件，使得开发者可以方便的将视频文件嵌入页面中。那么本文咱们就来看一下如何在HTML5页面播放视频直播。web

网页视频播放几乎都会使用 video 标签，video 标签的经常使用属性包括 src、width、height、controls、autoplay、preload、poster 等，关于这些标签的属性你们能够自行查阅，本文主要讲一下video 的视频播放。网络

video 视频播放主要有两种状况，内联播放和全屏播放。ide

在 iOS 系统中，点击播放视频时，页面会自动弹出一个系统默认原生全屏播放器来播放视频。若是咱们但愿视频在页面中内联播放，而不是全屏播放，能够经过添加参数 webkit-playsinline playsinline来控制（iOS10+ 支持）。post

在 Android 系统中，视频是默认内联播放的。但在开发测试过程当中发现一些安卓机在视频播放时，会将 video 的层级提到最高，挡住其余遮罩在视频区域上的元素，并且没法经过设置 z-index 来改变层级。性能

目前 video 标签在 HTML5 页面中的应用已经愈来愈多，表现形式也愈来愈丰富，但在 iOS 和 Android 两个不一样系统下使用 video 标签开发视频播放功能时，不可避免的会遇到手机兼容性问题。测试

咱们已经研发出 iOS 和 Android 两个不一样系统的实时直播推流方案，能够更简单地操控监控摄像系统；节省了人力物力，减小了工做量， 提供更精确、更实时的录像。优化

相信随着系统和环境的不断升级优化，必定会提出新的解决方案，作为开发者，咱们须要不断尝试新方法、新参数，来找到视频播放问题的最佳实践。spa