¿Cómo configurar 'X-Frame-Options' en iframe?

170

Si creo un iframecomo este:

var dialog = $('<div id="' + dialogId + '" align="center"><iframe id="' + frameId + '" src="' + url + '" width="100%" frameborder="0" height="'+frameHeightForIe8+'" data-ssotoken="' + token + '"></iframe></div>').dialog({

¿Cómo puedo solucionar el error?

Se negó a mostrar 'https://www.google.com.ua/?gws_rd=ssl'en un marco porque establece 'Opciones de marco X' a 'SAMEORIGIN'.

con JavaScript?

Darien Fawkes
fuente

Respuestas:

227

No se puede establecer X-Frame-Optionsen el iframe. Ese es un encabezado de respuesta establecido por el dominio desde el que solicita el recurso ( google.com.uaen su ejemplo). En SAMEORIGINeste caso, han establecido el encabezado , lo que significa que no han permitido la carga del recurso en un iframeexterior de su dominio. Para obtener más información, consulte El encabezado de respuesta X-Frame-Options en MDN.

Una inspección rápida de los encabezados (que se muestra aquí en las herramientas para desarrolladores de Chrome) revela el X-Frame-Optionsvalor devuelto por el host.

ingrese la descripción de la imagen aquí

Drew Gaynor
fuente
77
Con YouTube, puede cambiar la URL del punto final a la versión "incrustada". Vea stackoverflow.com/questions/25661182/… (Sé que esto no es estrictamente lo que está buscando el OP, ¡pero google da este resultado primero!)
73

X-Frame-Optionses un encabezado incluido en la respuesta a la solicitud para indicar si el dominio solicitado se permitirá que se muestre dentro de un marco. No tiene nada que ver con javascript o HTML, y no puede ser modificado por el creador de la solicitud.

Este sitio web ha configurado este encabezado para que no se muestre en un iframe. No hay nada que un cliente pueda hacer para detener este comportamiento.

Más información sobre las opciones de X-Frame

Rory McCrossan
fuente
Se establece en el encabezado de respuesta, no en el encabezado de solicitud. Pero por lo demás explicación precisa!
nickang
2
@nickang a eso me refería, sin embargo, estoy de acuerdo en que la terminología no estaba clara. Lo he editado para eliminar cualquier confusión. Gracias.
Rory McCrossan
31

En caso de que tenga el control del Servidor que envía el contenido del iframe, puede establecer la configuración X-Frame-Optionsen su servidor web.

Configurando Apache

Para enviar el encabezado X-Frame-Options para todas las páginas, agregue esto a la configuración de su sitio:

Header always append X-Frame-Options SAMEORIGIN

Configurando nginx

Para configurar nginx para enviar el encabezado X-Frame-Options, agréguelo a su configuración de http, servidor o ubicación:

add_header X-Frame-Options SAMEORIGIN;

Sin configuración

Esta opción de encabezado es opcional, por lo que si la opción no está configurada, le dará la opción de configurarla en la siguiente instancia (por ejemplo, el navegador de visitantes o un proxy)

fuente: https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options

rubo77
fuente
Esto me ayudo. Comento estas dos líneas: add_header Strict-Transport-Security "max-age=86400; includeSubdomains"; add_header X-Frame-Options DENY;de los fragmentos nginx, y luego funcionó de inmediato.
Zeth
NGINX, ¿es importante decir dónde , dentro de la ubicación?
Peter Krauss
Peter Kraus, ¿qué quieres?
rubo77
14

Como la solución no se mencionó realmente para el lado del servidor:

Uno tiene que configurar cosas como esta (ejemplo de apache), esta no es la mejor opción, ya que permite en todo, pero después de ver que su servidor funciona correctamente, puede cambiar fácilmente la configuración.

           Header set Access-Control-Allow-Origin "*"
           Header set X-Frame-Options "allow-from *"
Mike Q
fuente
5

en realidad no ... yo solía

 <system.webServer>
     <httpProtocol allowKeepAlive="true" >
       <customHeaders>
         <add name="X-Frame-Options" value="*" />
       </customHeaders>
     </httpProtocol>
 </system.webServer>
LongChalk
fuente
Esto parece una solución, pero ¿es esto una violación de seguridad?
Yogurtu
1
Es no es una buena idea desactivar la política del mismo origen para su sitio a menos que sepa exactamente lo que está haciendo. No debe permitir que dominios diferentes al suyo incrusten contenido. Ver codecademy.com/articles/what-is-cors y tutoriales similares.
slhck
5

y si nada ayuda y aún desea presentar ese sitio web en un iframe, considere usar X Frame Bypass Component que utilizará un proxy.

Tomer Ben David
fuente
2

El encabezado de respuesta HTTP X-Frame-Options se puede usar para indicar si un navegador debe tener permiso para representar una página en un <frame>, <iframe>o <object>. Los sitios pueden usar esto para evitar ataques de clickjacking, asegurando que su contenido no esté integrado en otros sitios.

Para más información: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

Tengo una solución alternativa para este problema, que voy a demostrar utilizando PHP:

iframe.php:

<iframe src="target_url.php" width="925" height="2400" frameborder="0" ></iframe>

target_url.php:

<?php 
  echo file_get_contents("http://www.example.com");
?>
Shailesh Dwivedi
fuente
55
¿Es esta una solución viable para usar la página después de que se carga? ¿Podré interactuar con las páginas después de la carga inicial? ¿No tendría que ser proxy cada solicitud para el dominio para usar el contenido después de que se carga?
Timothy Gonzalez el
0

Para este propósito, debe coincidir con la ubicación en su apache o cualquier otro servicio que esté utilizando

Si está utilizando apache, entonces en el archivo httpd.conf.

  <LocationMatch "/your_relative_path">
      ProxyPass absolute_path_of_your_application/your_relative_path
      ProxyPassReverse absolute_path_of_your_application/your_relative_path
   </LocationMatch>
Ibtesam Latif
fuente
0

La solución es instalar un complemento de navegador.

Un sitio web que emite un Encabezado HTTP X-Frame-Optionscon un valor de DENY(o SAMEORIGINcon un origen de servidor diferente) no se puede integrar en un IFRAME ... a menos que cambie este comportamiento instalando un complemento de navegador que ignore el X-Frame-OptionsEncabezado (por ejemplo , Ignorar encabezados de marco X de Chrome )

Tenga en cuenta que esto no se recomienda en absoluto por razones de seguridad.

Julien Kronegg
fuente
0

puede establecer la opción x-frame-en la configuración web del sitio que desea cargar en iframe como este

<httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="*" />
    </customHeaders>
  </httpProtocol>
Nikki
fuente
si quiero abrir stackoverflow, ¿dónde puedo encontrar la configuración web? ¿No es para el lado del servidor?
irum zahra
-1

Realmente no puede agregar el x-iframe en su cuerpo HTML, ya que debe ser proporcionado por el propietario del sitio y se encuentra dentro de las reglas del servidor.

Lo que probablemente pueda hacer es crear un archivo PHP que cargue el contenido de la URL de destino e iframe esa URL de PHP, esto debería funcionar sin problemas.

Sushant Chaudhari
fuente
1
"Probablemente puedas" y luego publícalo como un comentario si no es una respuesta
MK
¿Qué pasa si resulta ser una respuesta MK
Sushant Chaudhari
Entonces es una sugerencia que funcionó, no una solución específica, por lo que debe colocarse como un comentario
MK
-2

puede hacerlo en el archivo de configuración de nivel de instancia de tomcat (web.xml) necesita agregar el 'filtro' y el mapeo de filtro 'en el archivo de configuración web.xml. esto agregará [X-frame-options = DENY] en toda la página, ya que es una configuración global.

<filter>
        <filter-name>httpHeaderSecurity</filter-name>
        <filter-class>org.apache.catalina.filters.HttpHeaderSecurityFilter</filter-class>
        <async-supported>true</async-supported>
        <init-param>
          <param-name>antiClickJackingEnabled</param-name>
          <param-value>true</param-value>
        </init-param>
        <init-param>
          <param-name>antiClickJackingOption</param-name>
          <param-value>DENY</param-value>
        </init-param>
    </filter>

  <filter-mapping> 
    <filter-name>httpHeaderSecurity</filter-name> 
    <url-pattern>/*</url-pattern>
</filter-mapping>
Rejji
fuente
-3

Si está siguiendo el enfoque xml, el siguiente código funcionará.

    <security:headers>
        <security:frame-options />
        <security:cache-control />
        <security:content-type-options />
        <security:xss-protection />
    </security:headers>
<security:http>
Bikash Pandit
fuente