¿Cómo mostrar google.com en un iframe?

121

Estoy tratando de poner google.com en un iframe en mi sitio web, esto funciona con muchos otros sitios web, incluido Yahoo. Pero no funciona con Google, ya que solo muestra un iframe en blanco. ¿Por qué no rinde? ¿Hay algún truco para hacer eso?

Lo he probado de la manera habitual para mostrar un sitio web en un iframe como este:

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

La página de google.com no se muestra en el iframe, solo está en blanco. Que esta pasando?

html Bala
fuente
¿Por qué necesitas mostrar Google en un iframe?
Paul Alan Taylor
No me cite, pero tal vez Google use algo como window.propertyo algo que, dentro de un IFrame, rompería parte de la pantalla.
anónimamente
Si desea la barra de búsqueda de Google, consulte este enlace: google.com/webelements/#!/custom-search
mgraph
@PaulAlanTaylor Era un requisito de mi cliente, se dijo que quería mostrar el resultado de Google en su sitio web a mano en un iframe.
Bala
11
Solo haz esto:<iframe src="https://www.google.com/webhp?igu=1"></iframe>
niutech

Respuestas:

117

La razón de esto es que Google está enviando un encabezado de respuesta "X-Frame-Options: SAMEORIGIN". Esta opción evita que el navegador muestre iFrames que no están alojados en el mismo dominio que la página principal.

Ver: Mozilla Developer Network - El encabezado de respuesta de X-Frame-Options

Andreas Koch
fuente
18
Creo que esto es bastante inútil. Si alguien puede pensar en una razón para usar esa función además de ser malo, no dude en decírmelo.
anónimamente
15
@JonHanna uno no se pone simplemente en contacto con Google para cualquier cosa.
albert
23
Puede utilizar esta URL en iframe: google.com/search?igu=1
niutech
1
O puede usar mi componente web X-Frame-Bypass .
niutech
4
@niutech Increíblemente, su URL con el parámetro? igu = 1 funciona. ¿Alguna idea de por qué? ¿Cuál es el propósito original detrás de esa opción? Curiosamente, esto hace que aparezca como no conectado, pero el campo de búsqueda aún sugiere algunas de mis búsquedas históricas reales. Así que estoy "un poco" conectado. Muy extraño.
Mark Thomson
28

NO ES IMPOSIBLE.
Utilice un servidor proxy inverso para manejar el problema de origen diferente. Solía ​​usar Nginx proxy_passpara cambiar la URL de la página. puedes intentarlo.

Otra forma es escribir una página de proxy simple que se ejecute en el servidor usted mismo, solo solicítela a Google y envíe el resultado al cliente.

ijse
fuente
8
Google bloqueó mis simples intentos de encrespar su URL de búsqueda estándar. :( Terminé usando "Google Custom", que envía diferentes X-Frame-Options. Google.com/custom?q=test&btnG=Search
Joel Mellon
7
¿Existe un tutorial sobre cómo solucionar este problema con Nginx?
Negro
21

Como se ha descrito aquí, debido a que Google está enviando un encabezado de respuesta "X-Frame-Options: SAMEORIGIN", no puede simplemente establecer el src en " http://www.google.com " en un iframe.

Si desea incrustar Google en un iframe, puede hacer lo que sudopeople sugirió en un comentario anterior y usar un enlace de búsqueda personalizado de Google como el siguiente. Esto funcionó muy bien para mí (dejó 'q =' en blanco para comenzar con la búsqueda en blanco).

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

EDITAR:

Esta respuesta ya no funciona. Para obtener información e instrucciones sobre cómo reemplazar una búsqueda de iframe con un elemento de búsqueda personalizado de Google, consulte: https://support.google.com/customsearch/answer/2641279

ScottyG
fuente
¡Gracias ScottyG! ¿Hay opciones para agregar resultados de imágenes?
Krzysztof Przygoda
Hola Krzysztof Przygoda Creo que puedes forzar una búsqueda de imágenes con un src como: ¿ http://www.google.com/search?site=imghp&tbm=isch&q='searchstring'pero porque usa búsqueda? y no personalizado? no podrá usarlo en un iframe
ScottyG
1
@ScottyG ¿Sigue siendo válida la técnica anterior? Intenté colocar esa línea en una página en blanco y todo lo que obtengo es un iframe en blanco, incluso cuando proporciono una consulta
Andrés
2
Hola Andrés, parece que tienes razón. Ya no puedo hacer que esto funcione para mí. El enlace de búsqueda personalizado ahora redirige a google.ca/webhp?btnG=&gws_rd=ssl que fuerza ssl y parece estar bloqueado en un iframe ahora.
Seguiré
8

Puede omitir X-Frame-Options en un uso de 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>

Ejecútelo aquí: http://jsfiddle.net/2gou4yen/

Código desde aquí: ¿Cómo puedo omitir las opciones de X-Frame: encabezado HTTP SAMEORIGIN?

Netham
fuente
3
Está funcionando, pero no por primera vez. Si abro mi página web en la que tengo incrustado, tengo que presionar actualizar para cargar la página por primera vez. Después de eso, estará bien.
Vivek Sinha
@ TV-C-15 Funciona cuando se reemplaza http://query.yahooapis.compor https://query.yahooapis.com.
niutech
probado también en codepen [ codepen.io/anon/pen/Xyqqvb] y funciona (aunque en algún momento requiere una actualización) en firefox, chrome, opera, no funciona en el borde PERO si copio localmente y abro en el navegador, continúa recarga la página ... aquí el guión completo: [ files.fm/u/arzrb2h4]
Joe
1
no funciona. ¿Hay alguna otra forma de abrir Google en un iframe?
Krishna
3

Puede resolverlo utilizando Google CSE (Motor de búsqueda personalizado), que se puede insertar fácilmente en un iframe. Puede crear su propio motor de búsqueda, que busque en sitios seleccionados o también en toda la base de datos de Google.

Los resultados se pueden diseñar como prefiera, también similar al estilo de Google. Google CSE funciona con búsqueda web y de imágenes.

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
fuente
2

Esto solía funcionar porque lo usé para crear búsquedas personalizadas de Google con mis propias opciones. Google hizo cambios por su parte y rompió mi página de búsqueda personalizada privada :( Ya no funciona la muestra a continuación. Fue muy útil para patrones de búsqueda complejos.

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

web

Supongo que la mejor opción es usar Curl o similar.

Jim
fuente
1

No es ideal, pero puedes usar un servidor proxy y funciona bien. Por ejemplo, vaya a hidemyass.com, coloque www.google.com y coloque el enlace al que va en un iframe y ¡funciona!

Monty
fuente
0

Si está utilizando PHP, puede utilizar file_get_contents()para imprimir el contenido:

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

Esto imprimirá cualquier file_get_contents()función de contenido que obtenga en esta URL. Tenga en cuenta que, dado que está mostrando el contenido como una cadena en lugar de una página web real, cosas como las imágenes de ruta relativa no se muestran correctamente, porque /img/myimg.jpg ahora se está cargando desde su servidor y ya no desde google.com.

Sin embargo, puedes jugar con algunos trucos como la str_replace()función para reemplazar URL absolutas en imágenes:

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