google.comをiframeに表示する方法


121

私は自分のウェブサイトのgoogle.comをiframeに配置しようとしています。これは、yahooを含む他の多くのウェブサイトで動作します。ただし、空白のiframeが表示されるだけなので、Googleでは機能しません。なぜレンダリングしないのですか?それを行うためのトリックはありますか?

私はこのようにiframeでウェブサイトを表示する通常の方法でそれを試しました:

<iframe name="I1" id="if1" width="100%" 
 height="254" style="visibility:visible" 
 src="http://www.google.com"></iframe>

google.comページはiframeにレンダリングされず、空白になります。何が起こっている?


Googleをiframeで表示する必要があるのはなぜですか?
ポールアランテイラー

私を引用しないでください、しかしおそらくグーグルは何かのようなwindow.propertyものを使用しています、それはIFrame内で表示の一部を壊しますか?
匿名で2012年

Google検索バーが必要な場合は、このリンクを参照してください:google.com/webelements
#!/custom

@PaulAlanTaylorそれは私のクライアントの要件でした、それは彼がiframeの便利な彼のウェブサイトでグーグルの結果を見せたいと言われました。
Bala

11
これを実行してください:<iframe src="https://www.google.com/webhp?igu=1"></iframe>
niutech

回答:


117

これは、Googleが「X-Frame-Options:SAMEORIGIN」応答ヘッダーを送信しているためです。このオプションは、親ページと同じドメインでホストされていないiFrameをブラウザーに表示しないようにします。

参照:Mozilla Developer Network-X-Frame-Options応答ヘッダー


18
これはかなり役に立たないと思います。誰かがその機能を使用する理由を単に意味すること以外に考えることができたら、遠慮なく教えてください。
匿名で2012年

15
@JonHannaは、単にgoogleに連絡するだけではありません。
albert '19

23
あなたには、このURLを使用することができますiframegoogle.com/search?igu=1
niutech

1
または、私のX-Frame-Bypass Webコンポーネントを使用できます。
niutech

4
@niutech信じられないことに、?igu = 1パラメータを使用したURLは機能します。なぜだと思いますか?そのオプションの背後にある本来の目的は何ですか?興味深いことに、これによりログインしていないと表示されます、検索フィールドには実際の履歴検索の一部がまだ表示されます。だから私はログインしているのです。とても奇妙です。
Mark Thomson、

28

それは不可能ではありません。
リバースプロキシサーバーを使用して、異なる起源の問題を処理します。私はNginxを使ってproxy_passページのURLを変更していました。試すことができます。

もう1つの方法は、サーバー上で実行する単純なプロキシページを自分で作成し、Googleにリクエストしてその結果をクライアントに出力することです。


8
グーグルは彼らの標準的な検索URLを丸めようとする私の単純な試みを阻止した。:(結局、さまざまなX-Frame-Optionsを送信する「Googleカスタム」を使用しました。google.com/ custom?q
Joel Mellon

7
Nginxでこの問題を解決する方法に関するチュートリアルはありますか?
ブラック

21

ここで説明したように、Googleは "X-Frame-Options:SAMEORIGIN"応答ヘッダーを送信しているため、iframeでsrcを " http://www.google.com "に設定することはできません。

Googleをiframeに埋め込む場合は、上記のコメントで推奨されていることを実行し、次のようなGoogleカスタム検索リンクを使用できます。これは私にとってはうまくいきました(空の検索から始めるには「q =」を空のままにします)。

<iframe id="if1" width="100%" height="254" style="visibility:visible" src="http://www.google.com/custom?q=&btnG=Search"></iframe>

編集:

この答えはもはや機能しません。詳細と、iframe検索をGoogleカスタム検索要素に置き換える方法の手順については、https//support.google.com/customsearch/answer/2641279をご覧ください。


Thx ScottyG!画像結果を追加するオプションはありますか?
Krzysztof Przygoda 2014

Hey Krzysztof Przygoda srcのような画像検索を強制できると思いますが、検索をhttp://www.google.com/search?site=imghp&tbm=isch&q='searchstring'使用しているためですか?とカスタムではない?iframeで使用することはできません
ScottyG

1
@ScottyG上記の手法はまだ有効ですか?その行を空白のページにドロップしてみましたが、クエリを入力しても、取得できるのは空白のiframeだけです
Andres

2
こんにちはアンドレス、あなたは正しいかもしれません。これを機能させることができなくなりました。カスタム検索リンクがgoogle.ca/webhp?btnG=&gws_rd=sslにリダイレクトされるようになりました。これにより、sslが強制され、iframeでブロックされているように見えます。私はこれを調査し続けますが、パーティーはこれで終わったようです... :(
ScottyG

8

YQLを使用してX-Frame-Optionsをバイパスできます。

var iframe = document.getElementsByTagName('iframe')[0];
var url = iframe.src;
var getData = function (data) {
    if (data && data.query && data.query.results && data.query.results.resources && data.query.results.resources.content && data.query.results.resources.status == 200) loadHTML(data.query.results.resources.content);
    else if (data && data.error && data.error.description) loadHTML(data.error.description);
    else loadHTML('Error: Cannot load ' + url);
};
var loadURL = function (src) {
    url = src;
    var script = document.createElement('script');
    script.src = 'https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20data.headers%20where%20url%3D%22' + encodeURIComponent(url) + '%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=getData';
    document.body.appendChild(script);
};
var loadHTML = function (html) {
    iframe.src = 'about:blank';
    iframe.contentWindow.document.open();
    iframe.contentWindow.document.write(html.replace(/<head>/i, '<head><base href="' + url + '"><scr' + 'ipt>document.addEventListener("click", function(e) { if(e.target && e.target.nodeName == "A") { e.preventDefault(); parent.loadURL(e.target.href); } });</scr' + 'ipt>'));
    iframe.contentWindow.document.close();
}

loadURL(iframe.src);
<iframe src="http://www.google.co.in" width="500" height="300"></iframe>

ここで実行してください:http : //jsfiddle.net/2gou4yen/

ここからのコード:X-Frame-Options:SAMEORIGIN HTTPヘッダーをバイパスするにはどうすればよいですか?


3
動作していますが、初めてではありません。埋め込んだウェブページを開くと、ページを初めて読み込むために更新を押す必要があります。その後は良いでしょう。
Vivek Sinha

@ TV-C-15で置き換えるhttp://query.yahooapis.comと動作しますhttps://query.yahooapis.com
niutech 2018年

[codepenにも試験codepen.io/anon/pen/Xyqqvb] 、それは(いつかはリフレッシュするために必要とするが)、Firefoxの、クロム、オペラ上で動作しないのエッジ上の仕事 しかし、私はローカルにコピーして、私はブラウザに開いた場合、それはに続きますページをリロードします。ここに完全なスクリプトを記述します。[ files.fm/u/arzrb2h4]
Joe

1
機能していません。iframeでgoogleを開く他の方法はありますか?
クリシュナ

3

iframeに簡単に挿入できるGoogle CSE(カスタム検索エンジン)を使用して解決できます。独自の検索エンジンを作成して、選択したサイトまたはGoogleのデータベース全体を検索できます。

結果は、Googleスタイルと同様に、好みに合わせてスタイルを設定できます。Google CSEは、Webおよび画像検索で機能します。

google.php

<script>
  (function() {
    var cx = 'xxxxxxxxxxxxxxxxxxxxxx';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:searchresults-only></gcse:searchresults-only>

yourpage.php

<iframe src="google.php?q=<?php echo urlencode('your query'); ?>"></iframe>

2

これは、自分のオプションを使用してカスタムGoogle検索を作成するために使用したため、以前は機能していました。Googleが最後に変更を加え、私のカスタマイズされたプライベート検索ページを壊しました:(以下のサンプルは機能しなくなりました。複雑な検索パターンには非常に役立ちました。

<form method="get" action="http://www.google.com/search" target="main"><input name="q" value="" type="hidden"> <input name="q" size="40" maxlength="2000" value="" type="text">

ウェブ

Curlなどを使用することをお勧めします。


1

理想的ではありませんが、プロキシサーバーを使用でき、正常に動作します。たとえば、hidemyass.comに移動してwww.google.comに入力し、リンク先をiframeに配置すると機能します。


0

PHPを使用file_get_contents()している場合は、コンテンツの印刷に使用できます。

<?php
$page = file_get_contents('https://www.google.com');
echo $page;
?>

これはfile_get_contents()、このURLで取得するコンテンツ関数を印刷します。コンテンツを実際のWebページではなく文字列として表示しているため、/ img / myimg.jpgがサーバーから読み込まれ、google.comから読み込まれないため、相対パス画像などが正しく表示されないことに注意してください。

ただし、str_replace()画像内の絶対URLを置き換える関数のようないくつかのトリックで遊ぶことができます。

<?php
$page = file_get_contents('https://www.google.com');
echo str_replace('src="img/','src="https://google.com/img/',$page);
?>
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.