Wie zeige ich google.com in einem Iframe?

121

Ich versuche, google.com in einen Iframe auf meiner Website zu setzen. Dies funktioniert mit vielen anderen Websites, einschließlich Yahoo. Bei Google funktioniert dies jedoch nicht, da nur ein leerer Iframe angezeigt wird. Warum wird es nicht gerendert? Gibt es irgendwelche Tricks, um das zu tun?

Ich habe es auf übliche Weise versucht, eine Website in einem Iframe wie diesem anzuzeigen:

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

Die google.com-Seite wird nicht im Iframe gerendert, sondern nur leer. Was ist los?

Bala
quelle
Warum müssen Sie Google in einem Iframe anzeigen?
Paul Alan Taylor
Zitieren Sie mich nicht, aber vielleicht verwendet Google so etwas window.propertyoder etwas, das in einem IFrame einen Teil der Anzeige beschädigen würde?
anonym
Wenn Sie Google Search Bar möchten, sehen Sie diesen Link: google.com/webelements/#!/custom-search
mgraph
@PaulAlanTaylor Es war die Anforderung meines Kunden, es wurde gesagt, dass er das Google-Ergebnis auf seiner Website praktisch in einem Iframe anzeigen möchte.
Bala
11
Tun Sie dies einfach:<iframe src="https://www.google.com/webhp?igu=1"></iframe>
Niutech

Antworten:

117

Der Grund dafür ist, dass Google einen Antwortheader "X-Frame-Options: SAMEORIGIN" sendet. Diese Option verhindert, dass der Browser iFrames anzeigt, die nicht in derselben Domäne wie die übergeordnete Seite gehostet werden.

Siehe: Mozilla Developer Network - Der Antwortheader für X-Frame-Optionen

Andreas Koch
quelle
18
Ich finde das ziemlich nutzlos. Wenn sich jemand einen Grund vorstellen kann, diese Funktion zu nutzen, abgesehen davon, dass er nur gemein ist, können Sie es mir gerne sagen.
anonym
15
@ JonHanna man kontaktiert Google nicht einfach für irgendetwas.
Albert
23
Sie können diese URL verwenden in iframe: google.com/search?igu=1
niutech
1
Oder Sie können meine X-Frame-Bypass- Webkomponente verwenden.
Niutech
4
@niutech Unglaublicherweise funktioniert Ihre URL mit dem Parameter? igu = 1. Irgendeine Idee warum? Was ist der ursprüngliche Zweck dieser Option? Interessanterweise wird ich dadurch als nicht angemeldet angezeigt, aber das Suchfeld schlägt immer noch einige meiner tatsächlichen historischen Suchvorgänge vor. Also bin ich "irgendwie" eingeloggt. Sehr seltsam.
Mark Thomson
28

ES IST NICHT UNMÖGLICH.
Verwenden Sie einen Reverse-Proxy-Server, um das Problem mit unterschiedlichem Ursprung zu lösen. Ich habe Nginx verwendet proxy_pass, um die URL der Seite zu ändern. Sie können es versuchen.

Eine andere Möglichkeit besteht darin, eine einfache Proxyseite zu schreiben, die selbst auf dem Server ausgeführt wird. Fordern Sie einfach bei Google an und geben Sie das Ergebnis an den Client aus.

ijse
quelle
8
Google hat meine einfachen Versuche, die Standardsuch-URL zu kräuseln, blockiert. :( Am Ende habe ich "Google Custom" verwendet, das verschiedene X-Frame-Optionen sendet. Google.com/custom?q=test&btnG=Search
Joel Mellon
7
Gibt es ein Tutorial, wie man dieses Problem mit Nginx löst?
Schwarz
21

Wie hier beschrieben, können Sie den src in einem Iframe nicht einfach auf " http://www.google.com " setzen, da Google einen Antwortheader "X-Frame-Options: SAMEORIGIN" sendet .

Wenn Sie Google in einen Iframe einbetten möchten, können Sie die in einem Kommentar oben vorgeschlagenen Sudopeople ausführen und einen benutzerdefinierten Suchlink von Google wie den folgenden verwenden. Dies hat bei mir hervorragend funktioniert (links 'q =' leer, um mit der leeren Suche zu beginnen).

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

BEARBEITEN:

Diese Antwort funktioniert nicht mehr. Informationen und Anweisungen zum Ersetzen einer Iframe-Suche durch ein benutzerdefiniertes Google-Suchelement finden Sie unter: https://support.google.com/customsearch/answer/2641279

ScottyG
quelle
Danke ScottyG! Gibt es Optionen zum Hinzufügen von Bildergebnissen?
Krzysztof Przygoda
Hey Krzysztof Przygoda Ich denke, Sie können eine Bildsuche mit einem src wie erzwingen: http://www.google.com/search?site=imghp&tbm=isch&q='searchstring'aber weil es Suche verwendet? und nicht Brauch? Sie werden es nicht in einem
Iframe
1
@ScottyG Ist die obige Technik noch gültig? Ich habe versucht, diese Zeile auf eine leere Seite zu setzen, und alles, was ich bekomme, ist ein leerer Iframe, selbst wenn ich eine Abfrage stelle
Andres
2
Hallo Andres, sieht so aus, als hättest du recht. Ich bin nicht mehr in der Lage, dies für mich zum Laufen zu bringen. Der benutzerdefinierte Suchlink leitet jetzt zu google.ca/webhp?btnG=&gws_rd=ssl weiter, wodurch ssl erzwungen wird und jetzt in einem Iframe blockiert zu sein scheint. Ich werde das weiter untersuchen, aber es sieht so aus, als wäre die Party in diesem Fall vorbei ... :(
ScottyG
8

Sie können X-Frame-Optionen in einem mit YQL umgehen.

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>

Führen Sie es hier aus: http://jsfiddle.net/2gou4yen/

Code von hier: Wie kann ich die X-Frame-Optionen umgehen: SAMEORIGIN HTTP Header?

Netham
quelle
3
Es funktioniert aber nicht zum ersten Mal. Wenn ich meine Webseite öffne, in die ich eingebettet habe, muss ich auf Aktualisieren klicken, um die Seite zum ersten Mal zu laden. Danach wird es gut.
Vivek Sinha
@ TV-C-15 Es funktioniert , wenn Sie ersetzen http://query.yahooapis.commit https://query.yahooapis.com.
Niutech
auch getestet auf codepen [ codepen.io/anon/pen/Xyqqvb] und es funktioniert auf Firefox (wenn auch manchmal zu aktualisieren erfordert), Chrom, Oper, funktioniert nicht am Rande ABER wenn ich lokal kopieren und ich öffne in dem Browser es weiter Laden Sie die Seite neu. Hier ist das vollständige Skript: [ files.fm/u/arzrb2h4]
Joe
1
funktioniert nicht. Gibt es eine andere Möglichkeit, Google in einem Iframe zu öffnen?
Krishna
3

Sie können mit Google CSE (Custom Searche Engine) lösen , das einfach in einen Iframe eingefügt werden kann. Sie können Ihre eigene Suchmaschine erstellen, die ausgewählte Websites oder auch die gesamte Google-Datenbank durchsucht.

Die Ergebnisse können nach Ihren Wünschen gestaltet werden, ähnlich wie im Google-Stil. Google CSE arbeitet mit der Web- und Bildersuche.

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>
WalterV
quelle
2

Dies funktionierte früher, weil ich damit benutzerdefinierte Google-Suchanfragen mit meinen eigenen Optionen erstellt habe. Google hat am Ende Änderungen vorgenommen und meine private angepasste Suchseite beschädigt :( Das unten stehende Beispiel funktioniert nicht mehr. Es war sehr nützlich für komplexe Suchmuster.

<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">

Netz

Ich denke, die bessere Option ist, nur Curl oder ähnliches zu verwenden.

Jim
quelle
1

Es ist nicht ideal, aber Sie können einen Proxyserver verwenden und es funktioniert gut. Gehen Sie zum Beispiel zu hidemyass.com, geben Sie www.google.com ein und fügen Sie den Link, zu dem es geht, in einen Iframe ein, und es funktioniert!

Monty
quelle
0

Wenn Sie PHP verwenden, können Sie file_get_contents()den Inhalt drucken:

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

Dadurch wird jede Inhaltsfunktion gedruckt, die file_get_contents()in dieser URL enthalten ist. Bitte beachten Sie, dass Dinge wie relative Pfadbilder nicht korrekt angezeigt werden, da Sie Inhalte stattdessen als Zeichenfolge als tatsächliche Webseite anzeigen, da /img/myimg.jpg jetzt von Ihrem Server und nicht mehr von google.com geladen wird.

Sie können jedoch mit einigen Tricks wie der str_replace()Funktion spielen, um absolute URLs in Bildern zu ersetzen:

<?php
$page = file_get_contents('https://www.google.com');
echo str_replace('src="img/','src="https://google.com/img/',$page);
?>
Quakeglen
quelle