google-chrome - 如何让 chrome 允许视频自动播放?
问题描述
我找到了其他答案,但没有一个对我有用。Chrome 不会自动播放。
当前代码:
<iframe width="560" height="315"
src="https://www.youtube.com/embed/[...]
rel=0&controls=0&showinfo=0&autoplay=1" frameborder="0"
allow="autoplay; encrypted-media" allowfullscreen></iframe>
会在 Firefox 中自动播放,但不会在 chrome 中自动播放。没有找到任何可靠的文档。
编辑(和解决方案):
基本上,Chrome 需要将视频静音。如果静音,它将自动播放。
<video autoplay muted>
[your sources here]
</video>
解决方案
1 方法。将 chrome://flags/#autoplay-policy 中的自动播放策略更改为“不需要用户手势” https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
2 方法。使用脚本
<div id="player"></div>
<script>
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
function onYouTubeIframeAPIReady() {
var player;
player = new YT.Player('player', {
videoId: '439frli5VbM', // YouTube Video ID
width: 560, // Player width (in px)
height: 316, // Player height (in px)
playerVars: {
autoplay: 1, // Auto-play the video on load
controls: 1, // Show pause/play buttons in player
showinfo: 0, // Hide the video title
modestbranding: 1, // Hide the Youtube Logo
loop: 1, // Run the video in a loop
fs: 0, // Hide the full screen button
cc_load_policy: 0, // Hide closed captions
iv_load_policy: 3, // Hide the Video Annotations
autohide: 0 // Hide video controls when playing
},
events: {
onReady: function(e) {
e.target.mute();
}
}
});
}
</script>
推荐阅读
- javascript - 服务器端渲染中只能在浏览器中运行的包错误
- git - 用分支替换 git master (就像在 nuke master 中完全一样,只有分支,而不是一些单独的提交)
- javascript - React Native - 数组内对象内的数组状态更新问题
- mysql - 从表中选择多行并插入到不同的表中
- python - 我如何在 Ubuntu 中使用 pyenv 返回我的系统 python
- javascript - Vue - 是否可以在组件的计算属性中使用 Vuex getter?
- javascript - rm -rf 不显示任何错误但不删除任何文件 VS Code
- android - adb - 添加 PIN 但不安全启动的脚本
- java - 如何通过 HSSFWorkbook 设置图像大小
- apache-kafka - Kafka文件流连接和流API