YouTube IFrame API 使用 HTTPS + HTML5 生成混合内容警告答案

【问题标题】：YouTube IFrame API generates mixed content warning with HTTPS + HTML5YouTube IFrame API 使用 HTTPS + HTML5 生成混合内容警告
【发布时间】：2013-01-04 13:37:03
【问题描述】：

当我在 HTML5 模式下使用 iframe api 将 youtube 嵌入 HTTPS 页面时，它仍然使用 HTTP 提取实际流，这会生成混合内容警告。是否正确支持此用例？

我从 2011 年发现 this discussion，这表明它不是。但是，我只是尝试使用 HTTPS 访问 CDN 服务器，它可以工作 - 有点 - 但它返回错误的证书（google.com 而不是 youtube.com 的东西）。

有没有人设法使用 HTML5 中的 IFRAME API 在 HTTPS 页面上嵌入视频而不会触发混合内容警告（即 Chrome 中带有黄色警告标志的锁）？

谢谢

【问题讨论】：

我可以确认这仍然是一个问题。更令人费解的是，在某些情况下，视频流似乎是通过 HTTPS 请求的。我可以通过清除 *.youtube.com 的 cookie 来使其工作。
我发现我自己的安全扫描程序返回错误只是因为规范链接是 HTTP 而不是 HTTPS。将其与通过 HTTPS 请求的 URL 相同不是很有意义吗？

标签： ssl https youtube-api youtube-iframe-api

【解决方案1】：

看来（截至 2012 年 10 月）这是预期的行为，没有计划改变它：https://code.google.com/p/gdata-issues/issues/detail?id=2964&can=1&q=youtube%20https&colspec=API%20ID%20Type%20Status%20Priority%20Stars%20Summary

【讨论】：

【解决方案2】：

您可以通过将 iframe API 脚本配置为如下所示来解决此问题。

使用 '//' 作为标签 src

var tag = document.createElement('script');
tag.src = "//www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var url = window.location.pathname;

这将导致播放器使用与嵌入页面相同的协议来加载资源。

【讨论】：