如何禁止 iPhone Safari video标签视频自动全屏?

最近做一个移动端微信页面项目,在微信页面中有视频播放,但是需要禁止IOS的自动全屏播放(前提必须使用video标签)。
如:

<video id="post" autoplay loop preload="auto">
<source src="foo.mp4" type="video/mp4">
</video>

 

在iPhone safari 点击视频会弹出播放器进行全屏播放。

在网上看了看别人给出的答案,引用如下:

可以在 video 标签上加一个 “webkit-playsinline” 属性 ,如下:

<video id="video" width="280" height="140" webkit-playsinline ></video>

 

我想说这能解决问题吗? 答案当然是不能。。。。

当然在iOS APP中使用网页视频,是可以禁止全屏播放的,方法如下:
前端将video标签加入属性 webkit-playsinline,如:

<video id="player" width="480" height="320" webkit-playsinline>

Obj-C中,添加配置:

webview.allowsInlineMediaPlayback = YES

还有网友这样回答答案:
把视频转码,用ajax去分段请求数据来填充到canvas。

当然如果确实需要退出全屏,可以使用这样的方法,但是毕竟这样没什么必要。

所以最终的结论是:没有办法禁止 iPhone Safari video标签视频自动全屏.

 

+
(^_^)打赏作者喝个咖啡(^_^)
微信支付
支付宝支付
如果觉得文章写得不错或对您有用,请随意打赏。点击文章右下角“喜欢”二字,您的支持是我最大的鼓励
打赏支持
我要收藏
返回顶部
跳到底部
posted @   风雨后见彩虹  阅读(5069)  评论(0编辑  收藏  举报
编辑推荐:
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
点击右上角即可分享
微信分享提示