Iframe dans Chrome erreur: impossible de lire "localStorage" de "Fenêtre": Accès refusé pour ce document

J'ai une application web qui utilise le localStorage. Maintenant, nous voulons intégrer cette application sur d'autres (tiers) des sites via iframe. Nous voulons offrir un iframe intégrer similaire à youtube, de sorte que d'autres sites peuvent intégrer notre application web dans une iframe. Fonctionnellement c'est le même que si il ne serait pas intégré. Mais il ne fonctionne pas. Chrome affiche le message d'erreur: 

Uncaught SecurityError: Failed to read the 'localStorage' property from 'Window': Access is denied for this document.

Je viens de faire la vérification suivante (dans l'iframe): 

if (typeof window.localStorage !== 'undefined') {
    //SETUP SESSION, AUHT, LOCALE, SETTINGS ETC
} else {
    //PROVIDE FEEDBACK TO THE USER
}

J'ai vérifié mes paramètres de sécurité dans Chrome comme décrit dans un autre Stackoverflow Fil mais ça ne fonctionne pas. Est-il un changement pour faciliter l'incorporation possible sans la nécessité de l'ajustement (par défaut) les paramètres de sécurité de la plupart des navigateurs modernes?

De donner plus d'informations, nous utilisons de Braise-CLI pour notre web app et allumé CSP (plus d'infos sur la Braise-CLI CSP). Pourrait CSP cause de notre application web pour lancer des erreurs de sécurité?

  • votre titre fait référence à une iframe? est quelque chose dans l'iframe de la tentative d'accès au local de stockage? qui sonne comme il pourrait déclencher une alerte de sécurité?
  • J'ai reformulé ma question de départ. Nous voulons simplement nous fournir d'autres sites web la possibilité d'intégrer notre application web via iframe. Ainsi, le window.localStorage appel est dans notre code d'application web et, par conséquent, dans le iframe. Nous ne voulons pas faire toute fantaisie croix domaine de chose. Juste faire de notre application web disponible via iframe. Espérons que cela clarifie le problème.
  • si l'application web utilise le stockage local, puis en l'exécutant dans un iframe, va provoquer un cross-domain problème, parce que la Fenêtre est mondial... ce sera à essayer d'accéder aux locaux du client de la fenêtre.localstorage.. rappelez-vous locastorage est un navigateur client chose.. pas hébergé/server chose.. votre application n'a pas de savoir si il est servi à partir de n'importe où
  • Donc, il n'y a aucune chance pour qu'il fonctionne? Nous n'avons pas notre conception d'une application pour cela, mais de nombreux clients demandé cette fonctionnalité, donc nous avons besoin d'une solution. Je sais que localStorage est pas un serveur de chose. Mais je pensais que les entrées sont enregistrées par domaine. Je ne veux pas mettre quoi que ce soit pour un autre domaine, pour le domaine qui est spécifié dans l'attribut src de l'iframe. Est-il un moyen de contourner la fenêtre et il suffit d'écrire à notre "domaine" d'entrée de la localStorage?
  • pas avec localStorage. si vous voulez seulement de stocker des choses sur votre domaine, vous aurez besoin d'un back-end pour conserver des données à... en utilisant ember-data ou tel.
  • Peut-être utiliser un localstorage polyfill. Pourrait aider. code.google.com/p/chromium/issues/detail?id=357625
  • un pollyfill pourrait fonctionner si le problème réside uniquement dans le fait que le client n'a pas de localstorage capacité.. toutefois, le résultat final serait encore que les clients serait de stocker des données sur leurs propres navigateurs... qui devient un problème que si les données sont nécessaires pour faire des allers et retours dans l'iframe
  • Peut-être un polyfill est une bonne solution. Concernant notre utilisation de localStorage: nous ne stockons pas les données que nous voulons persistent à notre back-end là. Nous venons d'enregistrer les paramètres comme paramètres régionaux actuel, réel jeton d'accès etc. Si l'utilisateur efface le localStorage c'est tout à fait bien, elle/il a juste besoin de définir les paramètres régionaux de nouveau et de vous connecter à nouveau. On utilise braise-simple-auth qui s'appuie sur localStorage. J'espère que c'est pas trop douloureux pour intégrer un polyfill ou quelque chose de similaire...
  • pourtant, les données sont stockées localement ne sera pas disponible pour l'application hébergée dans le iframe.. qui est pourquoi vous obtenez l'origine des erreurs vous posé.. de ne pas être capable de lire les propriétés dans le local de stockage
  • d'accord je vois. Ainsi, un utilisateur ne peut pas se connecter à notre application, s'il est hébergé dans un iframe, parce que je ne peux pas écrire les identifiants de connexion pour le localStorage. Hm... c'est pas bien. Une idée de comment résoudre ce problème? Est le polyfill la seule option viable?
  • la seule chose que je peux suggérer, c'est de regarder dans CSP: content-security-policy.com il devrait y avoir un moyen de singe avec elle pour permettre à la croix-origine cmmunication sur iframes.. (voir: bac à sable).. mais l'avertissement est qu'il est risqué et pourrait ouvrir des failles...
  • aussi.. vous pourriez envisager de stocker les informations de session dans un contrôleur ou d'un service à la place de locaux de stockage... seulement utiliser le stockage local comme si l'utilisateur clique sur actualiser.
  • Je n'ai pas eu le temps d'étudier cette question de plus. J'ai juste essayé de nouveau et de ne pas intégrer l'iframe dans un fichier html qui est de servir de système de fichiers. Au lieu de cela, j'ai utilisé un fichier servi à partir d'un serveur web. Comme par magie tout fonctionne maintenant (testé dans Chrome, Firefox, IE11 et Safari). Peut-être que je l'ai expliqué ma question n'est pas dans le droit chemin, mais il semble fonctionner comme prévu quand j'ai d'abord essayé.

InformationsquelleAutor tschoartschi | 2015-05-27
  1. 20

    Sous Paramètres de google Chrome > vie privée > paramètres de Contenu, vous avez le cookie est défini sur "Bloquer les sites de stocker des données"

    Cette case à cocher est ce qui est à l'origine de l'exception.

    • si ce n'est pas par défaut, c'est surtout inutilisable, parce que les utilisateurs ne peuvent pas modifier les paramètres d'utilisation du site.
    • Il n'est pas à propos de le "Bloquer les sites de stocker des données" option, mais plutôt: "Bloquer les cookies tiers et les données de site" qui ne fait pas de la plupart des sites inutilisables, mais coupe la plupart des votre-recherche-annonces liées
    • Semble tout à fait déraisonnable de s'attendre que les visiteurs peuvent ajuster leurs paramètres pour cela. Et je suis sûr qu'il y a à être une meilleure solution. Je rencontre ce problème en essayant d'utiliser l'API Youtube sur un site. Youtube fonctionne très bien sur d'autres sites sans modifier les paramètres. Il doit y avoir une meilleure solution, ou Youtube ne fonctionne pas sur d'autres sites.
    • en quelque sorte, le site a été bloquer dans les paramètres de contenu j'aurais du le faire avant. Après avoir supprimer le site à partir de la liste de blocage qu'il fonctionne parfaitement pour moi.
    InformationsquelleAutor Paul Irish
  2. 12

    Selon cette

    Cette exception est levée lorsque l'option "Bloquer les cookies tiers et les données de site" case à cocher est définie dans les Paramètres de Contenu.

    Afin de trouver le réglage, ouvrez les paramètres de Chrome, de type "tiers" dans la zone de recherche, cliquez sur le bouton Paramètres de Contenu, et vue sur le quatrième point, en vertu de Cookies.

    Iframe dans Chrome erreur: impossible de lire

    InformationsquelleAutor alessandrio
  3. 4

    localStorage est par domaine, par protocole. Si vous essayez d'accéder à localStorage à partir d'un fichier autonome, c'est à dire avec file:/// protocole, il n'y a pas de domaine en soi. D'où les navigateurs actuellement serait plaindre que votre document n'a pas accès à localStorage. Si vous mettez votre fichier à un serveur web (par exemple, de déployer dans Tomcat) et y accéder à partir de localhost, vous serez en mesure d'accéder à localStorage.

    • mon auto, j'ai eu le problème avec un iFrame aujourd'hui à l'intérieur d'un site web .. donc votre réponse manque de quelque chose :/ reste de la lecture de ce sujet, je vous tiens au courant si je trouve quoi que ce soit.
    • si j'ai lu des commentaires sur la question, il prend tout son sens : si l'application web utilise le stockage local, puis en l'exécutant dans un iframe, va provoquer un cross-domain problème, parce que la Fenêtre est mondial... ce sera à essayer d'accéder aux locaux du client de la fenêtre.localstorage.. rappelez-vous locastorage est un navigateur client chose.. pas hébergé/server chose.. votre application n'a pas de savoir si il est servi à partir de n'importe où
    InformationsquelleAutor Somu
  4. 3

    Un moyen plus sûr de faire cela en Chrome serait pour autoriser uniquement le ou les site(s) en qui vous avez confiance:

    Chrome
  -> "Settings"
    -> "Show advanced settings..."
      -> "Privacy"
        -> "Content settings..."
          -> "Manage exceptions..."
            -> (add a pattern such as [*.]microsoft.com)
            -> be sure to hit enter
            -> "Done"
          -> "Done"
    InformationsquelleAutor GaTechThomas
  5. 3

    Sur l'URL suivante: chrome://settings/content/cookies décocher la case "Bloquer les cookies tiers".

    InformationsquelleAutor e18r
  6. 2

    Comme cela a été souligné dans les commentaires, localstorage est d'origine unique uniquement, à l'origine de la page. Tentative d'accéder à la page du localstorage à partir d'une iframe chargé à partir d'une origine différente, une erreur sera générée.

    Le meilleur que vous pouvez faire est de le pirater avec XDM via le postMessage API. Cette bibliothèque vise à faire le gros du travail pour vous, mais je n'ai pas essayé. Cependant, je voudrais assurez-vous que vous êtes conscient de IE est terrible de soutien pour XDM avant de descendre cette route.

    • Comme je l'ai souligné dans un commentaire avant, tout fonctionne comme prévu, après j'ai intégré l'iframe dans un fichier qui est servi à partir d'un serveur web au lieu de système de fichiers. Donc tout fonctionne bien. J'ai peut-être formulé ma question, à tort. Mais merci pour tous les commentaires et explications. Si quelqu'un est intéressé par plus de détails, il suffit de demander 🙂
    • Je suis confronté à un problème similaire. Pouvez-vous me dire comment vous l'avez résolu?
    • même problème ici, la réflexion sur les cookies.. :/
    InformationsquelleAutor Mike Post
  7. 2

    Pour se débarrasser de cet avertissement - sous Paramètres de google Chrome -> vie privée -> paramètres de Contenu, vous devez effacer le "Bloquer les cookies tiers et les données de site" option

    InformationsquelleAutor Picard
  8. 0

    à mon humble avis il n'a rien à voir avec le CSP paramètres de votre braise de la cli de l'app, mais de le faire avec les paramètres du navigateur.
    Certains navigateurs (Chrome) bloc localStorage contenu chargé dans un iframe.
    Nous aussi, nous sommes confrontés à une situation similaire pour nos Braise Application,nous avons une braise application et un plugin qui se charge de la 3e partie de sites web, le jeton de l'utilisateur chargé dans l'iframe est bloquée dans Chrom,on expérimente des solutions, va garder ce fil affichés sur la façon dont il va.

    InformationsquelleAutor Mad Scientist