Jak wyświetlić google.com w ramce iframe?


121

Próbuję umieścić google.com w ramce iframe w mojej witrynie. Działa to z wieloma innymi witrynami, w tym z Yahoo. Ale to nie działa z Google, ponieważ pokazuje tylko pusty element iframe. Dlaczego się nie renderuje? Czy są jakieś sztuczki, aby to zrobić?

Wypróbowałem to w zwykły sposób, aby wyświetlić witrynę internetową w takim elemencie iframe:

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

Strona google.com nie jest renderowana w ramce iframe, jest po prostu pusta. Co się dzieje?


Dlaczego musisz wyświetlać Google w ramce iframe?
Paul Alan Taylor

Nie cytuj mnie, ale może Google używa czegoś podobnego window.propertylub czegoś, co wewnątrz ramki iFrame zepsułoby część wyświetlacza?
anonimowo

jeśli chcesz pasek wyszukiwania Google, zobacz ten link: google.com/webelements/#!/custom-search
mgraph

@PaulAlanTaylor Było to wymaganie mojego klienta, powiedziano, że chce pokazać wyniki Google na swojej stronie internetowej w ramce iframe.
Bala

11
Po prostu zrób to:<iframe src="https://www.google.com/webhp?igu=1"></iframe>
niutech

Odpowiedzi:


117

Powodem tego jest to, że Google wysyła nagłówek odpowiedzi „X-Frame-Options: SAMEORIGIN”. Ta opcja zapobiega wyświetlaniu przez przeglądarkę ramek iFrame, które nie są hostowane w tej samej domenie co strona nadrzędna.

Zobacz: Mozilla Developer Network - nagłówek odpowiedzi X-Frame-Options


18
Myślę, że to całkiem bezużyteczne. Jeśli ktoś może wymyślić powód, dla którego powinien używać tej funkcji, oprócz bycia wrednym, powiedz mi.
anonimowo

15
@JonHanna one nie kontaktują się po prostu z Google w celu uzyskania czegokolwiek.
Albert

23
Możesz użyć tego adresu URL w iframe: google.com/search?igu=1
niutech

1
Lub możesz użyć mojego komponentu internetowego X-Frame-Bypass .
niutech,

4
@niutech Niesamowicie, Twój adres URL z parametrem? igu = 1 działa. Masz jakiś pomysł, dlaczego? Jaki był pierwotny cel tej opcji? Co ciekawe, powoduje to, że wyświetlam się jako niezalogowany, ale pole wyszukiwania nadal sugeruje niektóre z moich faktycznych wyszukiwań historycznych. Więc jestem „trochę” zalogowany. Bardzo dziwne.
Mark Thomson

28

TO NIE JEST NIEMOŻLIWE.
Użyj odwrotnego serwera proxy, aby rozwiązać problem z innym pochodzeniem. Kiedyś używałem Nginx proxy_passdo zmiany adresu URL strony. możesz spróbować.

Innym sposobem jest samodzielne napisanie prostej strony proxy działającej na serwerze, po prostu zażądaj od Google i wyślij wynik do klienta.


8
Google zablokowało moje proste próby zawinięcia ich standardowego adresu URL wyszukiwania. :( Skończyło się na tym, że użyłem „Google Custom”, który wysyła różne opcje X-Frame. Google.com/custom?q=test&btnG=Search
Joel Mellon

7
Czy istnieje poradnik, jak rozwiązać ten problem za pomocą Nginx?
Czarny

21

Jak zostało to tutaj przedstawione, ponieważ Google wysyła nagłówek odpowiedzi „X-Frame-Options: SAMEORIGIN”, nie można po prostu ustawić src na „ http://www.google.com ” w ramce iframe.

Jeśli chcesz osadzić Google w ramce iframe, możesz zrobić to, co sudopeople zasugerowały w powyższym komentarzu i użyć niestandardowego linku wyszukiwania Google, takiego jak poniżej. To zadziałało świetnie dla mnie (pozostawione „q =” puste, aby rozpocząć od pustego wyszukiwania).

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

EDYTOWAĆ:

Ta odpowiedź już nie działa. Aby uzyskać informacje i instrukcje, jak zastąpić wyszukiwanie iframe elementem wyszukiwarki niestandardowej Google, zobacz: https://support.google.com/customsearch/answer/2641279


Dzięki ScottyG! Czy są jakieś opcje dodawania wyników wyszukiwania obrazów?
Krzysztof Przygoda

Hej Krzysztof Przygoda Myślę, że możesz wymusić wyszukiwanie grafiki za pomocą src typu: http://www.google.com/search?site=imghp&tbm=isch&q='searchstring'ale dlatego, że używa wyszukiwania? a nie niestandardowe? nie będzie można go używać w
ramce

1
@ScottyG Czy powyższa technika jest nadal aktualna? Próbowałem upuścić ten wiersz na pustej stronie i wszystko, co otrzymuję, to pusta ramka iframe, nawet gdy podaję zapytanie
Andres

2
Cześć Andres, wygląda na to, że możesz mieć rację. Nie jestem już w stanie sprawić, by to działało dla mnie. Niestandardowy link wyszukiwania przekierowuje teraz do google.ca/webhp?btnG=&gws_rd=ssl, który wymusza ssl i wydaje się być teraz zablokowany w ramce iframe. Będę dalej to badał, ale wygląda na to, że impreza może się skończyć ... :(
ScottyG

8

Możesz ominąć X-Frame-Options w używającym YQL.

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>

Uruchom go tutaj: http://jsfiddle.net/2gou4yen/

Kod z tego miejsca: Jak ominąć opcje ramki X: Nagłówek HTTP SAMEORIGIN?


3
Działa, ale nie po raz pierwszy. Jeśli otworzę moją stronę internetową, na której osadziłem, muszę nacisnąć przycisk odświeżania, aby załadować stronę po raz pierwszy. Potem będzie dobrze.
Vivek Sinha,

@ TV-C-15 Działa po wymianie http://query.yahooapis.comz https://query.yahooapis.com.
niutech

testowany również na codepen [ codepen.io/anon/pen/Xyqqvb] i działa (chociaż czasami wymaga odświeżenia) na firefox, chrome, opera, nie działa na krawędzi, ALE jeśli kopiuję lokalnie i otwieram w przeglądarce nadal działa przeładuj stronę ... tutaj pełny skrypt: [ files.fm/u/arzrb2h4]
Joe

1
nie działa. Czy jest inny sposób na otwarcie Google w ramce iframe?
Krishna

3

Możesz rozwiązać problem za pomocą Google CSE (Custom Searche Engine), który można łatwo wstawić do elementu iframe. Możesz stworzyć własną wyszukiwarkę, która przeszukuje wybrane witryny lub całą bazę danych Google.

Wyniki mogą być stylizowane według własnego uznania, podobnie jak w Google. Google CSE współpracuje z wyszukiwarką sieciową i graficzną.

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

To działało, ponieważ używałem go do tworzenia niestandardowych wyszukiwań Google z własnymi opcjami. Google wprowadziło zmiany na ich końcu i zepsuło moją prywatną niestandardową stronę wyszukiwania :( Próbka nie działa już poniżej. Było to bardzo przydatne w przypadku złożonych wzorców wyszukiwania.

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

sieć

Myślę, że lepszą opcją jest użycie Curl lub podobnego.


1

Nie jest to idealne rozwiązanie, ale możesz użyć serwera proxy i działa dobrze. Na przykład przejdź do hidemyass.com, wstaw www.google.com i umieść link, do którego prowadzi, w ramce iframe i działa!


0

Jeśli używasz PHP, możesz file_get_contents()wydrukować zawartość:

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

Spowoduje to wydrukowanie dowolnej file_get_contents()funkcji zawartości, którą otrzyma w tym adresie URL. Zwróć uwagę, że ponieważ wyświetlasz treść jako ciąg znaków zamiast rzeczywistej strony internetowej, rzeczy takie jak obrazy ścieżek względnych nie są wyświetlane poprawnie, ponieważ /img/myimg.jpg ładuje się teraz z Twojego serwera, a nie z google.com.

Możesz jednak pobawić się pewnymi sztuczkami, takimi jak str_replace()funkcja, aby zastąpić bezwzględne adresy URL w obrazach:

<?php
$page = file_get_contents('https://www.google.com');
echo str_replace('src="img/','src="https://google.com/img/',$page);
?>
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.