web-dev-qa-db-ja.com

httpsサイトのiframe内でhttpコンテンツを許可する方法

HTMLをiframeにロードしましたが、参照されているファイルがhttpsではなくhttpを使用していると、次のエラーが発生します。

[ブロックされた] {current_pagename}のページは{referenced_filename}から安全でないコンテンツを実行しました

これをオフにする方法、またはそれを回避する方法はありますか。

Iframeはsrc属性を持たず、内容は次のように設定されます。

frame.open();
frame.write(html);
frame.close();
129
georgephillips

この質問の一般性に基づいて、私はあなたがオンラインであるサーバー上であなた自身のHTTPSプロキシを設定する必要があると思うでしょう。以下の手順を実行してください。

  • プロキシサーバーを準備する - IIS、Apacheをインストールする
  • セキュリティエラーを回避するために有効なSSL証明書を取得します(たとえばstartssl.comから無料)。
  • 安全でないコンテンツをダウンロードするラッパーを作成します(以下の方法)
  • あなたのサイト/アプリから入手 https://yourproxy.com/?page=http://insecurepage.com

あなたが単にfile_get_contentsまたはそれに似たものを介してリモートサイトのコンテンツをダウンロードするのであれば、あなたはまだコンテンツへの安全でないリンクを持つことができます。あなたはそれらを正規表現で見つけてまた置き換える必要があります。画像を解決するのは難しいですが、ここで回避策を見つけました: http://foundationphp.com/tutorials/image_proxy.php

25
panpernicek

注:この解決策は、2014年に書かれたときには一部のブラウザーで機能していた可能性がありますが、機能しなくなりました。 HTTPSページに埋め込まれたiframe内のHTTP URLへの移動またはリダイレクトは、フレームがHTTPS URLで始まっていても、最近のブラウザでは許可されていません。

私が作成した最良の解決策は、単にSSLプロキシとしてGoogleを使用することです...

https://www.google.com/search?q=%http://yourhttpsite.com&btnI=Im+Feeling+Lucky

テストし、Firefoxで動作します。

その他の方法

  • Embed.lyなどのサードパーティを使用します(ただし、それは実際にはよく知られているhttp APIにのみ適しています)。

  • あなたが管理しているhttpsページ上にあなた自身のリダイレクトスクリプトを作成してください(相対リンクされたページ上の単純なJavaScriptリダイレクトはトリックをするべきです。

    https://example.comこれは...にリンクしているiframeを持っています...

    https://example.com/utilities/redirect.htmlこれは以下のような単純なjsリダイレクトスクリプトを持っています...

    document.location.href ="http://thenonsslsite.com";

  • あるいは、RSSフィードを追加するか、httpサイトを読んでhttpsサイト内に表示するためのリーダー/パーサーを作成することもできます。

  • また、httpサイトの所有者にSSL接続を作成するように勧めます。 以外の理由でそれがseo を増やす場合。

あなたがhttpサイトの所有者にssl証明書を作成させることができない限り、最も安全で恒久的な解決策はあなたが必要とするコンテンツをつかむRSSフィードを作成することです。どのシステムにもログインしていないと言います)。

本当の問題は、httpsサイト内にhttp要素を持つことがセキュリティ上の問題を表すことです。このセキュリティ上のリスクを回避するための完全な方法はありません。そのため、上記は回避策の1つです。

ほとんどのブラウザでこのセキュリティ対策を無効にできることに注意してください(あなた自身、他人のためではない)。また、これらの「ハッキング」は時間の経過とともに時代遅れになる可能性があることにも注意してください。

126
Matthew Peters

私はこれが古い投稿であることを知っています、しかし別の解決策はcURLを使うことでしょう、例えば:

redirect.php:

<?php
if (isset($_GET['url'])) {
    $url = $_GET['url'];
    $ch = curl_init();
    $timeout = 5;
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
    $data = curl_exec($ch);
    curl_close($ch);
    echo $data;
}

それから、iframeタグの中で、

<iframe src="/redirect.php?url=http://www.example.com/"></iframe>

これはアイデアを説明するための単なる例です。URLをサニタイズするわけでも、他の人が自分の目的でredirect.phpを使用するのを妨げることもありません。あなた自身のサイトの文脈でこれらのことを考えてください。

ただし、利点はより柔軟です。たとえば、表示される前に実際に必要なものであることを確認するために、curl'dされた$ dataの検証を追加することができます。です。

プラス - 私は重要なことをJavascriptのリダイレクトに頼ることに少しうんざりしています。

乾杯!

25
David R.

頭に<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">を追加

参照: http://thehackernews.com/2015/04/disable-mixed-content-warning.html

ブラウザの互換性: http://caniuse.com/#feat=upgradeinsecurerequests

9
user2523022

Httpsページに安全でないコンテンツを表示しようとすると、ほとんどのブラウザで常にブロックされたコンテンツの警告が表示されます。 sslの背後にない他のサイトからのものを埋め込むのであれば、これは注意が必要です。あなたはあなた自身のブラウザで警告をオフにするかブロックを解除することができます、しかし他の訪問者にとってそれは問題です。

そのための1つの方法は、コンテンツサーバー側をロードして画像やその他のものをサーバーに保存してhttpsから表示することです。

Embed.lyのようなサービスを試して、それらを通してコンテンツを取得することもできます。彼らはhttpsの背後にあるコンテンツを取得するためのサポートを持っています。

7
Addeladde

SSLプロキシとしてのGoogleの使用は現在機能していません、

どうして?

Googleからページを開いた場合は、ヘッダーにx-frame-optionsフィールドがあります。 Google response header

X-Frame-Options HTTPレスポンスヘッダは、ブラウザが<frame><iframe><object>のいずれかでページをレンダリングすることを許可されるべきかどうかを示すために使用されます。サイトは、自分のコンテンツが他のサイトに埋め込まれていないことを確認することで、クリックジャック攻撃を回避するためにこれを使用することができます。

(MDNからの引用)

解決策の一つ

この問題に対する私の回避策は次のとおりです。

コンテンツをAWS S3にアップロードすると、リソースのhttpsリンクが作成されます。
Notice:全員に閲覧を許可するには、htmlファイルに許可を設定してください。

それ以降は、httpsのWebサイトでiframeのsrcとして使用できます。 AWS

5
David Guan

あなたはPHPや他のサーバーサイドの言語を使って必要なものを何でもスクラップしてから、iframeをスクラップしたコンテンツに置くことができます。これがPHPの例です。

scrapedcontent.php:

<?php
$homepage = file_get_contents('http://www.example.com/');
echo $homepage;
?>

index.html:

<iframe src="scrapedcontent.php"></iframe>
2
Grant

それがiframeに埋め込むためのURLの数がほとんど変わらない場合は、これにSSLプロキシを設定し、サーバ上の1つのhttps URLがプロキシサーバ上の1つのhttp URLにマップするように設定できます。

たとえば、このために ngrokmitmproxy を調べます。それらは小さくて設定が簡単です(ただし、通常はわずかに異なる目的を意味します)。

1
tanius