解决videojs在ios端视频无法播放的问题

fangcaojushi

于 2025-02-20 07:21:25 发布

阅读量517

点赞数 2

文章标签： ios 音视频

本文链接：https://blog.csdn.net/fangcaojushi/article/details/145743516

版权

解决videojs在ios端视频无法播放的问题

问题描述：
问题原因
- 116为本地环境，为无缓存
- 37为测试服务器
解决方法

问题描述：

在做多端嵌入的H5页面时，通过videojs插件做视频的播放，发现在web网页，andriod的app端，以及本地的服务器浏览直播都是没有问题的，只有ios发到线上时，页面加载第一次成功再次刷新页面视频一直处于缓冲状态，导致ios无法正常播放视频

问题原因

ios本身video插件做了缓存机制，本地服务无缓存，服务器端做了缓存，所有两个缓存导致ios端在加载video时出现了两次的嵌套

116为本地环境，为无缓存

在这里插入图片描述

37为测试服务器

在这里插入图片描述

解决方法

  <!-- 视频 -->
<div class="video_box" id="media">
<video id="video"
	class="video-js vjs-default-skin"
	poster="images/bgvideo.png"
	x5-video-player-type="h5-page"
	x5-video-player-fullscreen="false"
	x-webkit-airplay="true"
	playsinline
	webkit-playsinline="true"
	controls
	language="cn"
	preload="none"
	x5-video-orientation="landscape|portrait"
>
  // data-setup="{}"这个要注掉
<!-- <source /> -->
</video>
<div id="covervideo"></div>
<span class="no_live"><div class="mask"></div><p data-lang="liveExpect" id="liveExpect"></p><p data-lang="liveEnd" id="liveEnd"></p></span>
<!--显示弹幕-->
<!-- <p style="font-size: xx-large;height: 48px" id="mediaTitle">&nbsp;</p> -->
<!-- <div id="danmu" class="flying" style="pointer-events:none;"></div> -->
</div>