2012-01-02 28 views
88

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?¿Cómo mostrar google.com en un iframe?

He tratado de una manera habitual para mostrar una página web en un iframe como esto:

<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 presenta en el marco flotante, es sólo en blanco. Que esta pasando?

+0

¿Por qué necesita para mostrar Google en un iframe? –

+0

No me digas, pero tal vez google utiliza algo como 'window.property' o algo que, dentro de un IFrame, ¿podría romper parte de la pantalla? – annonymously

+0

si desea la barra de búsqueda de Google, consulte este enlace: http: //www.google.com/webelements/#!/Custom-search – mgraph

Respuesta

90

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 - The X-Frame-Options response header

+10

Creo que esto es bastante inútil. Si alguien puede pensar en una razón para usar esa función aparte de ser mala, no dude en decirme. – annonymously

+0

@ anónimamente no causa ningún problema, cuando obtiene permiso de alguien para insertar su contenido en el suyo, simplemente hace que cambie el encabezado que está enviando al mismo tiempo. –

+0

@JonHanna uno simplemente no contacta a google para nada. – albert

25

no es imposible.
Utilice un servidor proxy inverso para manejar el problema de origen diferente. Solía ​​usar Nginx con proxy_pass para cambiar la URL de la página. puedes intentarlo

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

+8

Google bloqueó mis intentos simples de curvar su url de búsqueda estándar. :(Terminé usando "Google Custom" que envía diferentes X-Frame-Options. Http://www.google.com/custom?q=test&btnG=Search –

+4

¿Hay algún tutorial sobre cómo resolver este problema con Nginx? – Black

1

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

16

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

Si desea insertar Google en un iframe, puede hacer lo que sudopeople sugirió en un comentario anterior y usar un enlace de búsqueda personalizada 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> 

EDIT:

esta pregunta 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 check out: https://support.google.com/customsearch/answer/2641279

+0

Thx ScottyG! ¿Hay alguna opción para agregar resultados a las imágenes? –

+0

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 la búsqueda? y no la personalizada? no podrá usarlo en un iframe – ScottyG

+1

@ScottyG ¿La técnica anterior sigue siendo válida? Intenté colocar esa línea en una página en blanco y allI get es un iframe en blanco , incluso cuando proporciono una consulta – Andres

1

Esto solía funcionar porque lo usaba para crear búsquedas de Google personalizadas con mis propias opciones. Google hizo cambios en su extremo y se rompió mi página de búsqueda personalizada privada :(muestra ya no trabaja más adelante. Fue muy útil para los patrones de búsqueda complejas.

<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 simplemente utilizar Curl o similar.

4

puede omitir X-Frame-Options en el 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 = 'http://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> 

Correrlo aquí.

http://jsfiddle.net/2gou4yen/

Código de aquí: How Can I Bypass the X-Frame-Options: SAMEORIGIN HTTP Header?

+2

no funciona - revisa tu violín –

+1

Está funcionando pero no por primera vez. Si abro mi En la página web en la que he incrustado, debo presionar Actualizar para cargar la página por primera vez. Después de eso, estará bien. –