首页 > 解决方案 > 浏览器中的视频元素使音乐应用静音

问题描述

我正在使用视频元素在我的网站上播放 mp4 视频,我在移动设备中遇到了奇怪的行为。

我正在静音和自动播放我的视频(根据 Chrome/Safari 指南),但是当我在后台运行 Spotify/Sound Cloud/其他音乐应用程序时,一旦我的视频正在播放,音乐应用程序将被静音并且操作系统指示浏览器是播放声音的应用程序。

此行为发生在 iOS 10 和 11 (Safari) 和 Android (Chrome) 中,并且在开始时它发生在与视频相关的所有情况 - 页面加载时播放,标签更改时恢复,切换到其他应用程序时恢复并切换回到浏览器,滚动到视频等。

我尝试将视频元素包装在 iframe 中,但它仅在几种情况下有所帮助 - 它解决了页面加载和滚动问题(每个案例都与视频相关,无需离开页面)。

澄清一下-我的视频元素始终静音+音量设置为0!

有没有人遇到过这样的问题并且知道是什么导致操作系统将浏览器识别为声音播放应用程序?

标签: javascriptandroidioshtml5-video

解决方案


找到了解决方案。异步播放和暂停视频(video.play/video.pause 调用由 setTimeout 包裹 0 秒)会导致问题。立即调用播放/暂停时,音乐应用在切换标签和切换应用时继续播放。


推荐阅读