HTTPS页面中的HTTPS iframe无法正常工作

Question

我们如何才能正确使用iframe中嵌入的github页面？

我在firebase中托管了一个网站,它使用的是https的自定义域名,例如https://www.example.com.

这个网站使用反应和其他东西,但对于一个路线(着陆页一个)我想使用github上托管的静态页面,例如https://example.github.io/page.因此,为了实现这一点,我在路线https://www.example.com/page中创建了一个iframe .

问题是我一直收到以下错误:

混合内容:" https://www.example.com/page "上的页面是通过HTTPS加载的,但是请求了一个不安全的资源" http://example.github.io/page/ ".此请求已被阻止; 内容必须通过HTTPS提供.

奇怪的是iframe看起来正确:

<iframe title="Page" src="https://example.github.io/page">unwanted text</iframe>

它已经在使用https了,但看起来这个被忽略了.我已经尝试使用此元数据<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">,关闭iframe </iframe>并在iframe中添加不需要的文本.

我们能解决这个问题吗

Answer 1

如果仔细检查HTML代码和错误消息,除了协议部分之外,您会发现URL略有不同:

• https://example.github.io/page - 在iframe src标签中
• http://example.github.io/page/ - 在错误消息中

原因可能是URL https://example.github.io/page返回重定向到带有斜杠(/page/)的"规范"版本,但重定向URL必须是完整的URL,服务器由于某种原因不包括重定向URL中的实际协议,总是使用http://.这可能是由于服务器端的配置或编码(另见github问题#289).

作为解决方法,使用不触发规范化重定向的URL,即https://example.github.io/page/.