web-dev-qa-db-fra.com

Comment définir 'X-Frame-Options' sur iframe?

Si je crée une iframe comme ceci: 

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

Comment puis-je réparer l'erreur:

Refuse d'afficher 'https://www.google.com.ua/?gws_rd=ssl' dans un cadre car il a défini 'X-Frame-Options' sur 'SAMEORIGIN'.

avec JavaScript?

108
Darien Fawkes

Vous ne pouvez pas définir X-Frame-Options sur la iframe. C'est un en-tête de réponse défini par le domaine à partir duquel vous demandez la ressource (google.com.ua dans votre exemple). Dans ce cas, ils ont défini l'en-tête sur SAMEORIGIN, ce qui signifie qu'ils ont interdit le chargement de la ressource dans une iframe en dehors de leur domaine. Pour plus d'informations, voir L'en-tête de réponse X-Frame-Options sur MDN.

Une inspection rapide des en-têtes (indiquée ici dans les outils de développement de Chrome) révèle la valeur X-Frame-Options renvoyée par l'hôte.

enter image description here

155
Drew Gaynor

Vous semblez avoir mal compris le problème. X-Frame-Options est un en-tête renvoyé avec la demande d'indiquer si le domaine demandé se permettra de s'afficher dans un cadre. Cela n'a rien à voir avec javascript ou HTML et ne peut pas être modifié par l'expéditeur de la demande.

Ce site Web a défini cet en-tête pour interdire son affichage dans une variable iframe. Vous ne pouvez rien faire pour arrêter ce comportement.

Autres lectures sur les options de trame X

54
Rory McCrossan

Si vous avez le contrôle du serveur qui envoie le contenu de l'iframe, vous pouvez définir le paramètre X-Frame-Options sur votre serveur Web.

Configurer Apache

Pour envoyer l'en-tête X-Frame-Options pour toutes les pages, ajoutez-le à la configuration de votre site:

Header always append X-Frame-Options SAMEORIGIN

Configuration de nginx

Pour configurer nginx afin d’envoyer l’en-tête X-Frame-Options, ajoutez-le à votre configuration http, serveur ou emplacement:

add_header X-Frame-Options SAMEORIGIN;

Pas de configuration

Cette option d'en-tête est facultative. Par conséquent, si l'option n'est pas définie, vous pourrez la configurer pour la prochaine instance (par exemple, le navigateur de visiteurs ou un proxy).

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

22
rubo77

pas vraiment ... j'ai utilisé 

 <system.webServer>
     <httpProtocol allowKeepAlive="true" >
       <customHeaders>
         <add name="X-Frame-Options" value="*" />
       </customHeaders>
     </httpProtocol>
 </system.webServer>
5
LongChalk

Puisque la solution n'a pas vraiment été mentionnée côté serveur:

Il faut définir des paramètres comme celui-ci (exemple d’Apache), ce n’est pas la meilleure option car elle permet tout, mais vous pouvez facilement modifier les paramètres après avoir constaté que votre serveur fonctionne correctement.

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

et si rien ne vous aide et que vous souhaitez toujours présenter ce site Web dans une iframe, envisagez d'utiliser composant de contournement de trame X qui utilisera un proxy.

2
Tomer Ben David

J'ai eu le même problème sur mon serveur virtualmin (Apache) pour wordpress dans un sous-répertoire et aucune des réponses ci-dessus ne pouvait résoudre le problème sur mon cas et je recevais toujours le message d'erreur x-frame-options denied sur la console au-dessous de la ligne vers le fichier .htaccess placé dans mon répertoire public_html\subdirectory\ (wordpress root):

header always set x-frame-options "SAMEORIGIN"

et ce fut la seule solution de travail dans mon cas. (notez qu'il existe une partie contenant always set plutôt que append ou always append)

2
Mojtaba Rezaeian

L'en-tête de réponse HTTP X-Frame-Options peut être utilisé pour indiquer si un navigateur doit ou non autoriser le rendu d'une page dans un <frame>, <iframe> ou <object>. Les sites peuvent l'utiliser pour éviter les attaques de détournement de clic, en veillant à ce que leur contenu ne soit pas intégré à d'autres sites.

Pour plus d'informations: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

J'ai une solution alternative à ce problème, que je vais démontrer en utilisant 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");
?>
2
Shailesh Dwivedi

La solution consiste à installer un plugin de navigateur. 

Un site Web qui émet HTTP Header X-Frame-Options avec la valeur DENY (ou SAMEORIGIN avec un serveur différent Origin) ne peut pas être intégré dans un IFRAME ... sauf si vous modifiez ce comportement en installant un plug-in de navigateur ignorant l'en-tête X-Frame-Options (par exemple, Ignorer les en-têtes X-Frame de Chrome ).

Notez que cela n'est pas recommandé du tout pour des raisons de sécurité. 

1
Julien Kronegg

Vous ne pouvez pas vraiment ajouter le x-iframe dans votre corps HTML car il doit être fourni par le propriétaire du site et se trouve dans les règles du serveur.

Ce que vous pouvez probablement faire est de créer un fichier PHP qui charge le contenu de l'URL cible et iframe cette URL php, cela devrait fonctionner normalement.

1
Sushant Chaudhari

Pour ce faire, vous devez faire correspondre le lieu dans votre Apache ou tout autre service que vous utilisez.

Si vous utilisez Apache, utilisez le fichier 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>
0
Ibtesam Latif

vous pouvez le faire dans le fichier de configuration d'instance Tomcat (web.xml). Il est nécessaire d'ajouter le filtre et le mappage de filtre dans le fichier de configuration web.xml. cela ajoutera le [X-frame-options = DENY] dans toute la page car il s’agit d’un paramètre 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>
0
Rejji

essaye ça

response['X-Frame-Options'] = 'ALLOWALL'

ou

response['X-Frame-Options'] = 'ALLOW-FROM http://yourdomain.com'

exemple

class ExampleView(generic.View):

    @method_decorator(csrf_exempt)
    def dispatch(self, request, *args, **kwargs):
        return super(ExampleView, self).dispatch(request, *args, **kwargs)

    def get(self, request, *args, **kwargs):
        res = api_request('get', 'example/xyx')
        response = HttpResponse(res)
        return self.set_response_header(request, response)

    def options(self, request, *args, **kwargs):
        response = HttpResponse()
        return self.set_response_header(request, response)

    def set_response_header(self, request, response):
        response['Access-Control-Allow-Origin'] = request.META.get('HTTP_Origin') if request.META.get('HTTP_Origin') else '*'
        response['Access-Control-Allow-Headers'] = 'x-requested-with, content-type, accept, Origin, authorization, x-csrftoken, user-agent, accept-encoding, cache-control'
        response['Access-Control-Allow-Methods'] = 'GET, POST, PUT, PATCH, DELETE, OPTIONS'
        response['Access-Control-Max-Age'] = '86400'
        response['Access-Control-Allow-Credentials'] = 'true'
        response['X-Frame-Options'] = 'ALLOWALL'
        return response
0
HoangYell

vous pouvez définir l'option x-frame-option dans la configuration Web du site que vous souhaitez charger dans iframe, comme ceci

<httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="*" />
    </customHeaders>
  </httpProtocol>
0
Nikki