Youtube embed autoplay on mobile(Youtube 在手机上嵌入自动播放)
问题描述
我使用 React 将 iframe 与页面上的 youtube 视频设置为正确大小.一切正常,但手机无法使用自动播放选项.
I use React to set iframe with youtube video on page in correct size. All works well but for mobiles doesn't work autoplay option.
页面有什么有趣的地方,我有什么作为示例视频,效果很好.
What is interesting for page, what I have as example video it works perfect.
<iframe type="text/html" allowTransparency="true" height="100%" width="100%" preload="metadata" gesture="media" allow="encrypted-media" className="autoplay-iframe"
src={`https://www.youtube.com/embed/`+this.props.autoplay+`?autoplay=1&version=3&html5=1&hd=1&controls=0&loop=1&playlist=`+this.props.autoplay+`&playsinline=1&rel=0&showinfo=0&modestbranding=1&related=0&enablejsapi=1&origin=`+window.location.hostname} frameborder="0"></iframe>
以上是我的 iframe 代码.我剪切了部分 iframe 代码,但样式属性中只有样式.这对于自动播放并不重要.其他页面的最终网址相同.我不确定为什么.有什么提示可以解决这个问题吗?
above is my iframe code. I cut some part of iframe code but there are just style in styles attribute. It isn't important for autoplay. The same finally url for other page works. I'm not sure why. Any hints how I can solve this problem?
提前致谢.
推荐答案
您将无法实现此功能,因为它已被有意禁用所有移动设备.原因是用户保存蜂窝数据.这篇文章.
You will not be able to implement this, since it is intentionally disabled to all mobile devices. The reason is for the user to save cellular data. It is also cited in this post.
视频自动播放不起作用的原因很简单.特点是在 iOS 和适用于移动设备的 Android.这样做的原因是为了节省移动用户的钱.此类设备(尤其是手机)经常使用收费的数据连接带宽.他们有数据限制,并且会产生费用.
The reason that video autoplay doesn’t work is simple. The feature is deliberately disabled in both iOS and Android for mobile devices. The reason this is done is to save mobile users money. Such devices (especially mobile phones) often use data connections that charge by bandwidth. They have data limits and going over results in a fee.
以下 SO 帖子也支持此声明.
This statement was also supported with the following SO post.
- 在 iframe HTML5 中没有自动播放移动播放器(Android Chrome 和 Firefox)?
- 如何让嵌入的 youtube 视频在 iphone 上自动启动
- Youtube 自动播放无法在移动设备上运行带有嵌入式 HTML5 播放器
这篇关于Youtube 在手机上嵌入自动播放的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:Youtube 在手机上嵌入自动播放
基础教程推荐
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 直接将值设置为滑块 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01