优酷视频仅支持iframe嵌入，需用https://player.youku.com/embed/vid格式链接，确保视频开启“允许嵌入”，并同时添加allowfullscreen和allow="fullscreen"属性；不支持video标签、自动播放及js控制。
优酷视频 iframe 嵌入怎么写才有效
优酷官方已关闭旧版 swf 播放器支持，现在必须用 iframe 方式嵌入，且需确保视频本身开启“允许嵌入”权限（在优酷视频发布设置里勾选“允许第三方网站嵌入”）。
直接复制分享链接里的 iframe 代码通常能用，但要注意三点：
- URL 中的
iframe参数必须存在，例如https://player.youku.com/embed/XMTg1MjM0NTU2NA==，不能是普通播放页链接 - 如果页面启用了 CSP（内容安全策略），需在
Content-Security-Policy头中加入https://player.youku.com - 移动端默认不自动播放，加
allow="autoplay"也无效 —— 优酷 iframe 不支持自动播放
标准嵌入示例：
<iframe width="100%" height="315" src="https://player.youku.com/embed/XMTg1MjM0NTU2NA==" frameborder="0" allowfullscreen></iframe>
腾讯视频 iframe 嵌入常见 404 或空白问题
腾讯视频 iframe 地址格式为 https://v.qq.com/txp/iframe/player.html?vid=xxxxx，但 vid 必须是视频的唯一标识符（不是 URL 中的数字 ID），且视频需在后台开启“允许外链播放”。
容易出错的地方：
- 从分享按钮复制的链接可能是短链或跳转页，要手动提取
vid—— 打开原视频页，看地址栏类似v.qq.com/x/page/d/xxx.html，其中xxx就是vid -
vid区分大小写，且含字母时不能误写成全小写（如o0033xxxxxx不等于O0033XXXXXX） - 部分老视频已下线或设为仅腾讯视频 App 内播放，iframe 会返回 404 或空白页，无报错提示
可用的嵌入示例：
<iframe width="100%" height="315" src="https://v.qq.com/txp/iframe/player.html?vid=o0033xxxxxx" frameborder="0" allowfullscreen></iframe>
iframe 宽高适配与响应式写法
固定 width 和 height 在移动端会拉伸变形，推荐用 CSS 实现等比缩放。
最简可行方案（无需 JS）：
- 给 iframe 外层加一个
div容器，设position: relative - 用
padding-top控制宽高比（如 16:9 →padding-top: 56.25%） - iframe 设为
position: absolute; top: 0; left: 0; width: 100%; height: 100%
这样既保持比例，又随容器宽度自适应。注意：腾讯和优酷的 iframe 都支持该写法，但不要同时设 width/height 属性，否则会覆盖 CSS。
为什么加了 allowfullscreen 却无法全屏
现代浏览器对 iframe 全屏有严格限制：只有显式声明 allow="fullscreen" 的 iframe 才能触发全屏 API。
务必检查 iframe 标签是否包含：
-
allowfullscreen（旧写法，部分浏览器兼容） - 更关键的是
allow="fullscreen"（新标准，Chrome 73+、Firefox 71+ 强制要求）
正确写法示例：
<iframe src="https://player.youku.com/embed/XXX" allowfullscreen allow="fullscreen"></iframe>
漏掉 allow="fullscreen"，点全屏按钮会静默失败，控制台也无报错 —— 这是最常被忽略的细节。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
