Chrome中的Iframe错误:无法从“Window”读取“localStorage”:拒绝访问此文档

ssgvzors  于 2022-09-28  发布在  其他
关注(0)|答案(14)|浏览(1003)

我有一个使用localStorage的web应用程序。现在我们想通过iframe在其他(第三方)网站上嵌入此web应用程序。我们希望提供类似于youtube的iframe嵌入,以便其他网站可以将我们的web应用程序嵌入到iframe中。从功能上来说,它与不嵌入它是一样的。但它不起作用。Chrome打印错误消息:

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

我只做了以下检查(在iframe中):

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

我用Chrome检查了我的安全设置,就像another Stackoverflow Thread中描述的那样,但它不起作用。在不需要调整大多数现代浏览器的(默认)安全设置的情况下,是否有任何更改使嵌入成为可能?
为了提供更多信息,我们将Ember CLI用于web应用程序,并启用了CSP(有关Ember CLI CSP的更多信息)。CSP会导致我们的web应用程序抛出安全错误吗?

pbwdgjma

pbwdgjma1#

在Chrome的设置>隐私>内容设置下,将cookie设置设置为“阻止网站设置任何数据”。
此复选框是导致异常的原因。

6mw9ycah

6mw9ycah2#

According to this
当在“内容设置”中设置“阻止第三方Cookie和站点数据”复选框时,会引发此异常。
要查找设置,请打开Chrome设置,在搜索框中键入“third”,单击内容设置按钮,然后查看Cookies下的第四项。

wj8zmpe1

wj8zmpe13#

在以下URL上:chrome://settings/content/cookies取消选中“阻止第三方Cookie”。

pgccezyw

pgccezyw4#

localStorage是按域、按协议的。如果尝试从独立文件访问localStorage,即使用file:///协议,则本身没有域。因此,浏览器当前会抱怨您的文档无法访问localStorage。如果您将文件放在web服务器中(例如,在Tomcat中部署)并从localhost访问它,您将能够访问localStorage

iklwldmw

iklwldmw5#

如果使用隐身模式,请确保关闭"Block third-party cookies"
在任何匿名窗口中打开一个新选项卡,然后关闭该选项:

mzaanser

mzaanser6#

我的手机遇到了这个问题,我无法用chrome打开某个网站。我花了一些时间在手机上找到饼干,当我找到它时,我发现我的饼干被屏蔽了。
转到设置-->站点设置-->Cookies
并允许站点保存和读取cookie数据,请确保不要阻止第三方cookie

我希望这对你有帮助。

wooyq4lh

wooyq4lh7#

我检查了所有答案,但最后什么也没找到。然后我意识到我在使用什么浏览器。如果你使用勇敢(基于铬),如果你的盾牌打开,你会得到这个错误。试着降低你的防护罩。

whlutmcx

whlutmcx8#

在Chrome中这样做的一个更安全的方法是只允许您信任的站点:

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

41zrol4v9#

正如注解中所指出的,localstorage只是一个源——页面的源。尝试从从其他来源加载的iframe访问页面的本地存储将导致错误。
你能做的最好的就是通过postMessage API用XDM破解它。This library声称为你做这项繁重的工作,但我还没有尝试过。然而,在走这条路之前,我会确保你知道IE对XDM的可怕支持。

dwbf0jvd

dwbf0jvd10#

如果禁用阻止第三方Cookie不是一个选项,则可以使用try…catch:

try {
 // SETUP SESSION, AUHT, LOCALE, SETTINGS ETC
} catch(err) {
 // PROVIDE FEEDBACK TO THE USER
}
yrefmtwq

yrefmtwq11#

imho它与您的ember-cli应用程序上的CSP设置无关,而是与浏览器设置有关。一些浏览器(Chrome)会阻止加载到iframe中的localStorage内容。我们的Ember应用程序也面临着类似的情况,如果我们有一个Ember应用和一个加载到第三方网站的插件,加载到iframe中的用户令牌在Chrome中会被阻止,我们正在试验一些解决方案,将保持此线程的状态。

8fq7wneg

8fq7wneg12#

要消除此警告-在Chrome的设置->隐私->内容设置下,您必须清除“阻止第三方Cookie和站点数据”选项

niwlg2el

niwlg2el13#

在Chrome右上角,点击eye徽标,允许您所在的站点使用第三方cookie,这样做很安全:
Check this image if you can't find the eye logo

li9yvcax

li9yvcax14#

清除Cookie
Chrome->设置->隐私和策略->永远不能使用cookie的站点反过来删除cookie以用于本地存储。

相关问题