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

news/2025/2/21 5:30:24

解决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>

http://www.niftyadmin.cn/n/5860225.html

相关文章

MySQL数据库入门到大蛇尚硅谷宋红康老师笔记 高级篇 part 2

第02章_MySQL的数据目录 1. MySQL8的主要目录结构 1.1 数据库文件的存放路径 MySQL数据库文件的存放路径&#xff1a;/var/lib/mysql/ MySQL服务器程序在启动时会到文件系统的某个目录下加载一些文件&#xff0c;之后在运行过程中产生的数据也都会存储到这个目录下的某些文件…

使用 FFmpeg 剪辑视频指南

FFmpeg 是一个功能强大的多媒体处理工具&#xff0c;可以进行视频和音频的剪辑、合并、转码等操作。本文将详细介绍如何使用 FFmpeg 进行视频剪辑&#xff0c;并通过实例帮助你快速掌握剪辑技巧。我们会从最基础的剪切功能讲起&#xff0c;再延伸到一些高级操作&#xff0c;如指…

Spring Boot 常用注解详解

文章目录 Spring Boot 常用注解详解1. Spring Boot 核心注解1.1 SpringBootApplication1.2 Configuration1.3 ComponentScan 2. Bean 相关注解2.1 Bean2.2 Component2.3 Service2.4 Repository2.5 Controller 和 RestController 3. 依赖注入注解3.1 Autowired3.2 Qualifier3.3 …

基于 Flask 与 MySQL 构建简单的博客系统

引言 在互联网时代&#xff0c;博客是人们分享知识、记录生活的重要平台。借助 Python 的 Flask 框架与 MySQL 数据库&#xff0c;我们可以快速搭建一个简单的博客系统。本文将详细介绍如何从零开始构建这样一个系统&#xff0c;涵盖环境搭建、数据库设计、后端接口实现以及前端…

.NET8入门:13.ASP.NET Core MVC

ASP.NET Core MVC是一种十分经典的软件设计模式架构&#xff0c;接下来我们来了解一下MVC在ASP.NET8中的一些基础概念。 MVC架构 MVC架构主要包含以下三层&#xff1a; M&#xff08;Model&#xff09;&#xff1a;模型层&#xff0c;其职责为UI显示以及业务逻辑或操作所需要…

Debezium 报错:“The db history topic is missing” 的处理方法

Debezium 报错:“The db history topic is missing” 的处理方法 一、引言 在使用 Debezium 进行数据同步时,可能会遇到一个常见的错误:“The db history topic is missing”。这个错误表明 Debezium 无法找到或访问其数据库历史记录主题(db history topic),这通常是由…

[特殊字符]边缘计算课程资料整理|从零到实战全攻略[特殊字符]

文末联系&#xff0c;获取整套视频教程资料和课件资料 &#x1f4da;边缘计算课程资料整理&#xff5c;从零到实战全攻略&#x1f680; &#x1f4a1;「基础入门篇」打牢根基 1️⃣ 第1章&#xff1a;边缘计算就在身边&#x1f50d; &#x1f449;&#x1f3fb; 消费电子/智慧…

第3章 3.3日志 .NET Core日志 NLog使用教程

3.3.1 .NET Core日志基本使用 书中介绍了把日志输出到控制台的使用方式&#xff1a; 安装 Microsoft.Extensions.Logging 和 Microsoft.Extensions.Logging.Console 日志记录代码&#xff1a; using Microsoft.Extensions.DependencyInjection; using Microsoft.Extensions.…