Surmonter "Affichage interdit par X-Frame-Options"

J'écris une petite page Web dont le but est d'encadrer quelques autres pages, simplement pour les consolider dans une seule fenêtre de navigateur pour en faciliter la visualisation. Certaines des pages que j'essaie d'encadrer interdisent d'être encadrées et lancent un "Refus d'afficher le document car l'affichage est interdit par X-Frame-Options". erreur dans Chrome. Je comprends qu'il s'agit d'une limitation de sécurité (pour une bonne raison), et je n'ai pas accès à la modifier.

Existe-t-il une autre méthode de cadrage ou de non-cadrage pour afficher les pages dans une seule fenêtre qui ne seront pas déclenchées par l'en-tête X-Frame-Options?

J'ai eu un problème similaire, où j'essayais d'afficher le contenu de notre propre site dans un iframe (comme une boîte de dialogue de style lightbox avec Colorbox ), et où nous avions un en-tête "X-Frame-Options SAMEORIGIN" à l'échelle du serveur sur le serveur source l'empêchant de se charger sur notre serveur de test.

Cela ne semble être documenté nulle part, mais si vous pouvez modifier les pages que vous essayez d'iframe (par exemple, ce sont vos propres pages), envoyer simplement un autre en-tête X-Frame-Options avec n'importe quelle chaîne désactive les commandes SAMEORIGIN ou DENY.

par exemple. pour PHP, mise

<?php
    header('X-Frame-Options: GOFORIT'); 
?>

en haut de votre page, les navigateurs combineront les deux, ce qui donne un en-tête de

X-Frame-Options SAMEORIGIN, GOFORIT

... et vous permet de charger la page dans un iframe. Cela semble fonctionner lorsque la commande SAMEORIGIN initiale a été définie au niveau du serveur, et vous souhaitez la remplacer sur un cas page par page.

Bonne chance!

Si vous obtenez cette erreur pour une vidéo YouTube, plutôt que d'utiliser l'URL complète, utilisez l'URL intégrée des options de partage. Cela ressemblera àhttp://www.youtube.com/embed/eCfDxZxTBW4

Vous pouvez également remplacer watch?v=par devient embed/ainsihttp://www.youtube.com/watch?v=eCfDxZxTBW4http://www.youtube.com/embed/eCfDxZxTBW4

Si vous obtenez cette erreur en essayant d'incorporer une carte Google dans un iframe, vous devez l'ajouter &output=embedau lien source.

MISE À JOUR 2019: Vous pouvez contourner X-Frame-Optionsun <iframe>JavaScript côté client uniquement et mon composant Web X-Frame-Bypass . Voici une démo: Hacker News dans unX-Frame-Bypass . (Testé dans Chrome et Firefox.)

Ajout d'un

  target='_top'

à mon lien dans l'onglet facebook a résolu le problème pour moi ...

Il existe un plugin pour Chrome, qui supprime cette entrée d'en-tête (pour un usage personnel uniquement):

https://chrome.google.com/webstore/detail/ignore-x-frame-headers/gleekbfjekiniecknbkamfmkohkpodhe/reviews

Si vous obtenez cette erreur en essayant d'incorporer du contenu Vimeo, changez le src de l'iframe,

de: https://vimeo.com/63534746
à: http://player.vimeo.com/video/63534746

J'ai eu le même problème lorsque j'ai essayé d'intégrer moodle 2 dans iframe, la solution est Site administration ► Security ► HTTP securityet vérifiezAllow frame embedding

C'est la solution les gars !!

FB.Event.subscribe('edge.create', function(response) {
    window.top.location.href = 'url';
});

La seule chose qui a fonctionné pour les applications Facebook!

Il semble que X-Frame-Options Allow-From https: // ... est déprécié et a été remplacé (et est ignoré) si vous utilisez Content-Security-Policy plutôt l'en tête .

Voici la référence complète: https://content-security-policy.com/

Solution pour charger un site Web externe dans un iFrame même difficile, l'option x-frame est définie pour être refusée sur le site Web externe.

Si vous souhaitez charger un autre site Web dans un iFrame et que vous obtenez l' Display forbidden by X-Frame-Options”erreur, vous pouvez réellement surmonter cela en créant un script proxy côté serveur.

L' srcattribut de l'iFrame pourrait avoir une URL ressemblant à ceci:/proxy.php?url=https://www.example.com/page&key=somekey

Ensuite, proxy.php ressemblerait à quelque chose comme:

if (isValidRequest()) {
   echo file_get_contents($_GET['url']);
}

function isValidRequest() {
    return $_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['key']) && 
    $_GET['key'] === 'somekey';
}

Cela passe le bloc, car il s'agit simplement d'une demande GET qui pourrait tout aussi bien être une visite de page de navigateur ordinaire.

Attention: vous souhaiterez peut-être améliorer la sécurité de ce script. Parce que les pirates pourraient commencer à charger des pages Web via votre script proxy.

J'ai essayé presque toutes les suggestions. Cependant, la seule chose qui a vraiment résolu le problème était:

1. Créez un .htaccessdans le même dossier où se trouve votre fichier PHP.

2. Ajoutez cette ligne à htaccess:

   Header always unset X-Frame-Options

L'intégration du PHP par une iframe d'un autre domaine devrait fonctionner ensuite.

De plus, vous pouvez ajouter au début de votre fichier PHP:

header('X-Frame-Options: ALLOW');

Ce qui n'était cependant pas nécessaire dans mon cas.

J'ai eu le même problème avec mediawiki, c'est parce que le serveur a nié intégrer la page dans un iframe pour des raisons de sécurité.

Je l'ai résolu en écrivant

$wgEditPageFrameOptions = "SAMEORIGIN"; 

dans le fichier de configuration php de mediawiki.

J'espère que cela aide.

FWIW:

Nous avons eu une situation où nous devions tuer notre iFramelorsque ce code "disjoncteur" est apparu. J'ai donc utilisé le PHP function get_headers($url);pour vérifier l'URL distante avant de l'afficher dans un fichier iFrame. Pour de meilleures performances, j'ai mis les résultats en cache dans un fichier, donc je ne faisais pas de connexion HTTP à chaque fois.

J'utilisais Tomcat 8.0.30, aucune des suggestions n'a fonctionné pour moi. Comme nous cherchons à mettre à jour le X-Frame-Optionset à le définir ALLOW, voici comment j'ai configuré pour autoriser les iframes intégrés:

• Accédez au répertoire Tomcat conf, modifiez le fichier web.xml
• Ajoutez le filtre ci-dessous:

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

       <filter-mapping>
                   <filter-name>httpHeaderSecurity</filter-name>
                   <url-pattern>/*</url-pattern>
                   <dispatcher>REQUEST</dispatcher>
       </filter-mapping> 

• Redémarrez le service Tomcat
• Accédez aux ressources à l'aide d'un iFrame.

La seule question qui a un tas de réponses. Bienvenue dans le guide que j'aurais aimé avoir quand je me battais pour que cela fonctionne à 10h30 le soir le jour limite ... FB fait des choses étranges avec des applications de toile, et bien, vous avez été prévenu. Si vous êtes toujours là et que vous avez une application Rails qui apparaîtra derrière un canevas Facebook, vous aurez besoin de:

Gemfile:

gem "rack-facebook-signed-request", :git => 'git://github.com/cmer/rack-facebook-signed-request.git'

config / facebook.yml

facebook:
  key: "123123123123"
  secret: "123123123123123123secret12312"

config / application.rb

config.middleware.use Rack::Facebook::SignedRequest, app_id: "123123123123", secret: "123123123123123123secret12312", inject_facebook: false

config / initializers / omniauth.rb

OmniAuth.config.logger = Rails.logger
SERVICES = YAML.load(File.open("#{::Rails.root}/config/oauth.yml").read)
Rails.application.config.middleware.use OmniAuth::Builder do
  provider :facebook, SERVICES['facebook']['key'], SERVICES['facebook']['secret'], iframe:   true
end

application_controller.rb

before_filter :add_xframe
def add_xframe
  headers['X-Frame-Options'] = 'GOFORIT'
end

Vous avez besoin d'un contrôleur pour appeler à partir des paramètres de toile de Facebook, j'ai utilisé /canvas/et fait que l'itinéraire devienne le principal SiteControllerpour cette application:

class SiteController < ApplicationController
  def index
    @user = User.new
  end
  def canvas
    redirect_to '/auth/failure' if request.params['error'] == 'access_denied'
    url = params['code'] ? "/auth/facebook?signed_request=#{params['signed_request']}&state=canvas" : "/login"
    redirect_to url
  end
  def login
  end
end

login.html.erb

<% content_for :javascript do %>
  var oauth_url = 'https://www.facebook.com/dialog/oauth/';
  oauth_url += '?client_id=471466299609256';
  oauth_url += '&redirect_uri=' + encodeURIComponent('https://apps.facebook.com/wellbeingtracker/');
  oauth_url += '&scope=email,status_update,publish_stream';
console.log(oauth_url);
  top.location.href = oauth_url;
<% end %>

Sources

• Je pense que la configuration vient de l'exemple d'Omniauth.
• Le fichier gem (qui est la clé !!!) est venu de: SlideShare choses que j'ai apprises ...
• Cette question de pile avait tout l'angle Xframe, donc vous obtiendrez un espace vide, si vous ne placez pas cet en-tête dans le contrôleur d'application.
• Et mon homme @rafmagana a écrit ce guide heroku , que vous pouvez maintenant adopter pour les rails avec cette réponse et les épaules des géants dans lesquels vous marchez.

target = '_ parent'

En utilisant l'idée de Kevin Vella, j'ai essayé d'ajouter cet attribut aux éléments de formulaire créés par le générateur de boutons de PayPal. A fonctionné pour moi afin que Paypal ne s'ouvre pas dans une nouvelle fenêtre / onglet de navigateur.

Je ne sais pas à quel point c'est pertinent, mais j'ai construit une solution à cela. Sur mon site, je voulais afficher un lien dans une fenêtre modale contenant un iframe qui charge l'URL.

Ce que j'ai fait, c'est que j'ai lié l'événement de clic du lien à cette fonction javascript. Tout cela ne fait que faire une demande à un fichier PHP qui vérifie les en-têtes d'URL pour X-FRAME-Options avant de décider de charger l'URL dans la fenêtre modale ou de rediriger.

Voici la fonction:

  function opentheater(link, title){
        $.get( "url_origin_helper.php?url="+encodeURIComponent(link), function( data ) {
  if(data == "ya"){
      $(".modal-title").html("<h3 style='color:480060;'>"+title+"&nbsp;&nbsp;&nbsp;<small>"+link+"</small></h3>");
        $("#linkcontent").attr("src", link);
        $("#myModal").modal("show");
  }
  else{
      window.location.href = link;
      //alert(data);
  }
});


        }

Voici le code du fichier PHP qui le vérifie:

<?php
$url = rawurldecode($_REQUEST['url']);
$header = get_headers($url, 1);
if(array_key_exists("X-Frame-Options", $header)){
    echo "nein";
}
else{
    echo "ya";
}


?>

J'espère que cela t'aides.

J'ai rencontré ce problème lors de l'exécution d'un site Web wordpress. J'ai essayé toutes sortes de choses pour le réparer et je ne savais pas comment, finalement le problème était parce que j'utilisais le transfert DNS avec masquage et que les liens vers des sites externes n'étaient pas traités correctement. c'est-à-dire que mon site a été hébergé à http: //123.456.789/index.html mais a été masqué pour fonctionner à http://somewebSite.com/index.html . Quand je suis entré, http: //123.456.789/index.html l'a dans le navigateur en cliquant sur ces mêmes liens, il n'y a eu aucun problème d'origine X-frame dans la console JS, mais en exécutant http://somewebSite.com/index.htmlfait. Pour masquer correctement, vous devez ajouter les serveurs de noms DNS de votre hôte à votre service de domaine, c'est-à-dire que godaddy.com devrait avoir des serveurs de noms, par exemple, ns1.digitalocean.com, ns2.digitalocean.com, ns3.digitalocean.com, si vous étiez en utilisant digitalocean.com comme service d'hébergement.

Il est surprenant que personne ici n'ait jamais mentionné Apacheles paramètres ( *.conffichiers) du serveur ou le .htaccessfichier lui-même comme étant la cause de cette erreur. Recherchez dans vos fichiers de configuration .htaccessou Apache, en vous assurant que vous n'avez pas l'ensemble suivant DENY:

Header always set X-Frame-Options DENY

Le changer en SAMEORIGIN, fait fonctionner les choses comme prévu:

Header always set X-Frame-Options SAMEORIGIN

La seule vraie réponse, si vous ne contrôlez pas les en-têtes sur votre source que vous voulez dans votre iframe, est de le proxy. Demandez à un serveur d'agir en tant que client, recevez la source, supprimez les en-têtes problématiques, ajoutez CORS si nécessaire, puis envoyez une requête ping à votre propre serveur.

Il y a une autre réponse expliquant comment écrire un tel proxy. Ce n'est pas difficile, mais j'étais sûr que quelqu'un devait le faire auparavant. Il était juste difficile de le trouver, pour une raison quelconque.

J'ai finalement trouvé quelques sources:

https://github.com/Rob--W/cors-anywhere/#documentation

^ préféré. Si vous avez besoin d'une utilisation rare, je pense que vous pouvez simplement utiliser son application Heroku. Sinon, c'est du code pour l'exécuter vous-même sur votre propre serveur. Notez bien quelles sont les limites.

anyorigin.org

^ deuxième choix, mais assez ancien. choix supposément plus récent en python: https://github.com/Eiledon/alloworigin

puis il y a le troisième choix:

http://anyorigin.com/

Ce qui semble permettre un peu d'utilisation gratuite, mais vous placera sur une liste de honte publique si vous ne payez pas et utilisez un montant non spécifié, dont vous ne pouvez être retiré que si vous payez les frais ...

Non mentionné mais peut aider dans certains cas:

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState !== 4) return;
    if (xhr.status === 200) {
        var doc = iframe.contentWindow.document;
        doc.open();
        doc.write(xhr.responseText);
        doc.close();
    }
}
xhr.open('GET', url, true);
xhr.send(null);

Utilisez cette ligne donnée ci-dessous au lieu de la header()fonction.

echo "<script>window.top.location = 'https://apps.facebook.com/yourappnamespace/';</script>";

j'ai eu ce problème et l' ai résolu en modifiant httd.conf

<IfModule headers_module>
    <IfVersion >= 2.4.7 >
        Header always setifempty X-Frame-Options GOFORIT
    </IfVersion>
    <IfVersion < 2.4.7 >
        Header always merge X-Frame-Options GOFORIT
    </IfVersion>
</IfModule>

j'ai changé SAMEORIGIN en GOFORIT et redémarré le serveur

Essayez cette chose, je ne pense pas que quelqu'un ait suggéré cela dans le sujet, cela résoudra comme 70% de votre problème, pour certaines autres pages, vous devez supprimer, j'ai la solution complète mais pas pour le public,

AJOUTER ci-dessous à votre iframe

sandbox = "allow-same-origin allow-scripts allow-popups allow-forms"

Modifiez .htaccess si vous souhaitez supprimer X-Frame-Options de tout un répertoire.

Et ajoutez la ligne: l'en-tête désactive toujours les options X-Frame

[contenu de: Surmonter "Affichage interdit par X-Frame-Options"