Chrome 的本地 html 文件中未触发存储事件答案

【问题标题】：Storage event not triggering in local html file in ChromeChrome 的本地 html 文件中未触发存储事件
【发布时间】：2018-04-13 07:42:12
【问题描述】：

我在 ~/test.html 的本地文件中有以下 html：

<html>
  <head>
    <title>Test Event</title>
  </head>
  <body>
    Test Event
  </body>
</html>

我在 Chrome（版本 62.0.3202.75）的两个不同窗口中打开它。在第一个窗口的控制台中，我输入以下 JS：

window.addEventListener('storage', function(e) {  
    console.log('criou sdasd');
    console.log(e.key);
    console.log(e.oldValue);
    console.log(e.newValue);
    console.log(e.url);
    console.log(e.storageArea);
});

在第二个窗口的控制台我输入以下JS：

localStorage.setItem('Chronometer.time', '00:00');

在第一个窗口中什么也没有发生。

有趣的事实：

如果我在第一个窗口的控制台上运行 localStorage.getItem('Chronometer.time')，我会得到 "00:00"。
如果我只打开两个新的空 Chrome 选项卡并执行上述相同步骤，我确实会在第一个窗口中触发一个事件。

存储事件对本地 html 文件有效吗？

【问题讨论】：

它很容易在 chrome 中重现 ...如果使用file:/// 协议方案打开文件 - 因为 Chrome 将 file:/// 选项卡与彼此“交谈”隔离开来- on a local file 向我建议 file:///
@JaromandaX 那么第一页如何访问第二页设置的值？这听起来像一个铬错误。我可以在 chrome 52 中重现，而不是在 FF57 中。
我不关注@Kaiido - 我的意思是......如果页面是http:// 或https:// 然后在一个选项卡中更改本地存储将在另一个选项卡中触发事件（在同一个域上）在 Firefox 和 Chrome 中......如果两个页面都加载了，Firefox 也可以这样工作file:/// - Chrome 不......
@JaromandaX 不，在 FF 中，即使在 file:// 协议上，如果两个文档都指向同一个 .html 文件，事件也会触发。在 chrome 中，storageArea 在这种情况下是共享的（您访问由第一个选项卡中的第二个选项卡设置的新值），但是存储事件不会触发。这是一个错误，因为当您的 storageArea 被其他文档修改时，它应该会触发。
@JaromandaX OP 需要启动带有 --allow-file-access-from-files 标志的 chrome

标签： javascript google-chrome local-storage

【解决方案1】：

默认情况下，Chrome 会阻止本地文件 (file:///*) 相互“交谈”，这是一种安全措施。您可以通过使用 --allow-file-access-from-files 标志启动 Chrome 来禁用此限制：

chrome.exe --allow-file-access-from-files

现在存储事件应该可以正常处理本地文件了。

【讨论】：