javascript - 测试浏览器是否支持非静音播放视频
<p><p>如何测试视频是否在不被静音的情况下内联播放？</p>
<p>我自己尝试过创建一小段自动播放小视频 (20kb) 的脚本。根据视频是否“正在播放”返回一个 bool 值。</p>
<p>它似乎正在工作。在 iOS 上，它返回 false。在桌面上它返回 true。 </p>
<p>但是，我想获得第二个意见，这是否是运行测试的正确方法。</p>
<p>JS:</p>
<pre><code>var $video = $('video');
$video.on( 'loadstart', function(){
setTimeout(function(){
alert( isUnmutedInlineSupported() ? 'supported' : 'unsupported' );
}, 500);
});
function isUnmutedInlineSupported(){
if( !$video.paused && $video.currentTime > 0 ) {
//playsinline unmuted supported
return true;
} else {
//playsinline unmuted unsupported
return false;
}
}
</code></pre>
<p>HTML:</p>
<pre><code><video playsinline loop autoplay poster="https://placehold.it/1600x900">
<source src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/214327/html5-video-sound-test.mp4" type="video/mp4" />
</video>
</code></pre>
<p> <a href="https://codepen.io/hassforshort/pen/baXrXo" rel="noreferrer noopener nofollow">https://codepen.io/hassforshort/pen/baXrXo</a> </p></p>
<br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
<p><p>这是检查视频是否已开始播放的最佳方式。由 webkit 推荐 <a href="https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/" rel="noreferrer noopener nofollow">https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/</a> </p>
<p></p><div class="snippet"data-lang="js"data-hide="false"data-console="true"data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var promise = document.querySelector('video').play();
if (promise !== undefined) {
promise.catch(error => {
// Auto-play was prevented
// Show a Play Button to let the user manually start playback
}).then(() => {
// Auto-play started
});
}</code></pre>
<p style="font-size: 20px;">关于javascript - 测试浏览器是否支持非静音播放视频，我们在Stack Overflow上找到一个类似的问题：
<a href="https://stackoverflow.com/questions/48465395/" rel="noreferrer noopener nofollow" style="color: red;">
https://stackoverflow.com/questions/48465395/
</a>
</p>
页:
[1]