web-dev-qa-db-ja.com

HTTPSページ内のHTTPS iframeが機能しない

Iframeに埋め込まれたgithubページを正しく使用するにはどうすればよいですか？

FirebaseでWebサイトをホストし、https経由でカスタムドメインを使用しています。たとえば、https://www.example.com。

このウェブサイトは反応などを使用しますが、1つのルート（ランディングページの1つ）では、githubでホストされる静的なページを使用したいと思います。たとえば、https：// example .github.io/page。そのため、これを実現するために、ルート内にiframeを作成しましたhttps://www.example.com/page 。

問題は、次のエラーが表示されることです。

混合コンテンツ：「 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内に不要なテキストを追加しようとしました。

これを解決できますか？

iframehttpsgithub-pagesfirebase-hostingmixed-content
11
GarouDan

HTMLコードとエラーメッセージを注意深く調べると、プロトコル部分以外にURLのわずかな違いに気付くでしょう。

  • https://example.github.io/page-iframesrcタグ内
  • http://example.github.io/page/-エラーメッセージ

その理由としては、URL https://example.github.io/page が「正規」にredirectを返すことです。 "末尾にスラッシュ（/page/）が付いたバージョンですが、リダイレクトURLは完全なURLである必要があり、サーバーは何らかの理由でリダイレクトURLに実際のプロトコルを含めず、常にhttp://を代わりに使用します。サーバー側での構成またはコーディングが原因である可能性があります（github issue ＃289 も参照）。

回避策として、正規化リダイレクトをトリガーしないURL、つまりhttps://example.github.io/page/を使用します。

26
rustyx