[SOLUCIONADO] Cómo configurar x-frame-options?

berkeleyPunk · #1 (**permalink**) 26/04/2015, 17:38

Hola!

La idea es esta: visualizar un doc.html hallado en un dominio, en un iFrame de otro dominio.

He googleado, y veo que muchos se encuentran con el mismo problema que yo:
Uncaught SecurityError: Blocked a frame with origin "http://pruebas-berkeley.hol.es" from accessing a frame with origin "http://drupal-001.hol.es". Protocols, domains, and ports must match.

Entiendo que X-Frame-Options es un encabezado HTTP. Que tal cosa puede configurarse directamente en el servidor, en config.inc.php (para Apache), para negar/permitir que otros dominios (o incluso el nuestro propio) puedan visualizar nuestro sitio web dentro de iFrames, como Google.

No hago mis pruebas en servidores dedicados, así que no tengo acceso al config.inc.php.

Así voy, hasta el momento, sin éxito.
En el servidor 1 tengo a padre.php que sólo contiene:

Código PHP:

Ver original<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title: Este es el documento PADRE</title>
</head>
<body>
    <iframe src="http://pruebas-berkeley.hol.es/hijo.php"></iframe>
</body>
</html>

En el servidor 2 tengo a hijo.php que contiene:

Código HTML:

Ver original<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title: Este documento está dentro de un iFrame</title>
</head>
<body>
    <a href="javascript:window.location.href=('http://www.facebook.com/share.php?u='+dir2+'&t='+tit2+'')" target="_blank">Compartir en Facebook</a>
 
    <script type="text/javascript">
        var dir  = window.document.URL;
        var dir2 = encodeURIComponent(dir);
        var tit  = window.document.title;
        var tit2 = encodeURIComponent(tit);
    </script>
</body>
</html>

Como verán, pongo un link encargado de compartir en Facebook el documento actual (la idea es que, si logro arreglar lo de X-Frame-Options, dicho link comparta el sitio del dominio PADRE).

Ahora bien, justo arriba de <!DOCTYPE html> en padre.php, pongo:

Código PHP:

Ver original<?php header('X-Frame-Options: ALLOW-FROM http://pruebas-berkeley.hol.es'); ?>

Pero Chrome me sigue diciendo que 'X-Frame-Options' está configurado en 'DENY'.

He puesto también estas reglas (una a la vez) en el HTACCESS del servidor PADRE, sólo para ver si funciona el cambio de DENY a SAMEORIGIN:

Código htaccess:

Ver originalHeader append X-FRAME-OPTIONS "SAMEORIGIN"
Header set X-Frame-Options SAMEORIGIN

Pero Chrome sigue diciendo que 'X-Frame-Options' está configurado en 'DENY'.

Imagino que tendría mayores posibilidades de arreglar mi problema si tuviera yo acceso al config.inc.php. Pero como hago mis pruebas en servidores gratuitos, ¿de plano estoy perdido? ¿No hay forma de hacer que funcione si se trata de servidores compartidos, gratuitos o no?

Saludos!

PHPeros · #2 (**permalink**) 27/04/2015, 11:12

Si te fijas, en la tabla de aquí abajo, los navegadores Chrome y Safari no soportan la directiva Allow-From

berkeleyPunk · #3 (**permalink**) 27/04/2015, 20:09

Cita:

Iniciado por PHPeros

Si te fijas, en la tabla de aquí abajo, los navegadores Chrome y Safari no soportan la directiva Allow-From

En efecto, ya había dado yo con esa URL que comentas, maestro, pero como vi que ahí se habla de navegadores ya viejitos (IE8, Firefox 18), pensé que probablemente el tiempo les habría hecho un cambio. ¿En cuáles vamos? Chrome 42 y IE11.

Las caritas que pongo no son en broma:

Saludos!

PHPeros · #4 (**permalink**) 28/04/2015, 07:44

Pues no. No funcionan y dudo que lo hagan en un futuro. Tendrás que usar otra alternativa como por ejemplo AJAX + CORS... cargar primero el contenido y luego mostrarlo en lugar de usar iframe.

berkeleyPunk · #5 (**permalink**) 28/04/2015, 19:48

Cita:

Iniciado por PHPeros

Pues no. No funcionan y dudo que lo hagan en un futuro. Tendrás que usar otra alternativa como por ejemplo AJAX + CORS... cargar primero el contenido y luego mostrarlo en lugar de usar iframe.

AJAX +CORS

What do you mean?

:

Jajajaj, ya, en serio. Parece que hubo un malentendido en mi trabajo con lo que se quería hacer. No tengo necesidad de entrar en el problema con x-frame-options.

De cualquier forma, acabas de darme entrada a CORS. Voy a investigar qué se puede hacer con ello.

Saludos y hasta pronto!

PHPeros · #6 (**permalink**) 29/04/2015, 08:23

CORS es una forma de realizar peticiones asíncronas a sitios externos, generalmente con AJAX.

berkeleyPunk · #7 (**permalink**) 10/05/2015, 16:11

Veamos, logré realizar lo que quería en un principio.

..., y la cosa no tiene nada que ver con los x-frame-options. Más aún, la cosa funciona a pesar que Google Chrome sigue diciendo que los protocolos, puertos y dominios tienen que ser los mismos para que se logre establecer plena comunicación entre dos sitios de distintos dominios mediante un iframe.

Por acá encuentran la forma como hacerlo..., y por acá encuentran el ejemplo que yo realicé.

Esto, según yo, es oro molido.

berkeleyPunk · #8 (**permalink**) 10/05/2015, 16:14

Veamos, logré realizar lo que quería en un principio.

..., y la cosa no tiene nada que ver con los x-frame-options. Más aún, la cosa funciona a pesar que Google Chrome sigue diciendo que los protocolos, puertos y dominios tienen que ser los mismos para que se logre establecer plena comunicación entre dos sitios de distintos dominios mediante un iframe.

Por acá encuentran la forma como hacerlo.

Por aquí les dejo el ejemplo que realicé enviando mensaje de PADRE a HIJO, y por acá de HIJO a PADRE.
y por acá encuentran el ejemplo que yo realicé.

No hay PHP, así que pueden descargar todo con confianza.