时间戳

首页 > 解决方案 > iOS Safari 是否支持 storageEvents？

javascript - iOS Safari 是否支持 storageEvents？

问题描述

我有以下示例代码（托管在https://d-dsuo5j1fc.now.sh/），它应该显示 2 个不断变化的日期字符串。第一个是简单的 500 毫秒循环，第二个是 StorageEvent 的结果。这个想法是这个页面在两个选项卡中加载，这样每个选项卡都会收到另一个选项卡中本地存储更改的警报。

它在 Chrome/iOS 中运行良好，但在 Safari iOS 中，第二个字符串从未更新，这表明它没有触发 onStorage 事件。

<body>
    Own timer<span id='s'> </span><br>
    From storage event <span id='ev'> </span>
</body>
<script>
let s = document.getElementById('s');
let ev = document.getElementById('ev');
function onStorageEvent(storageEvent){
    ev.innerHTML = storageEvent.newValue;  // display the storage event value
}
window.addEventListener('storage', onStorageEvent, false);
// every 500ms, generate a new string, display it and write it to localstorage
setInterval(()=>{
    let d =  new Date().toGMTString() + ' ' + Math.random();
    s.innerHTML = d;    // display our fresh value
    localStorage.setItem('foo',d);  // and write it to localstorage
}
,500);
</script>

此外，对于 iOS 上 Safari 的 HTML5 不兼容问题有什么好的资源建议吗？

标签： javascripthtmlsafarilocal-storagemobile-safari

解决方案

它在 Chrome/iOS 中运行良好，但在 Safari iOS 中，第二个字符串从未更新，这表明它没有触发 onStorage 事件。

我也使用以下代码进行了尝试：

let s = document.getElementById('s');
let ev = document.getElementById('ev');

function onStorageEvent(storageEvent) {
  ev.innerHTML = storageEvent.newValue; // display the storage event value
  document.getElementById("console").innerHTML += "<br>something has changed (Event type: '" + event.type + "')";
}
window.addEventListener('storage', onStorageEvent, false);
// every 500ms, generate a new string, display it and write it to localstorage
setInterval(() => {
  let d = new Date().toGMTString() + ' ' + Math.random();
  s.innerHTML = d; // display our fresh value
  localStorage.setItem('foo', d); // and write it to localstorage
}, 500);
Own timer<span id='s'> </span><br> From storage event <span id='ev'> </span>
<div id="console"></div>

这是JSFiddle链接，因为此示例在 SO 沙箱工具中不起作用。所以我在字符串中显示了event.type( document.getElementById("console").innerHTML += "<br>something has changed (Event type: '" + event.type + "')";) 以确保触发了正确的事件。但正如您在下面的 GIF 中看到的那样，它对我来说效果很好。我还做了一些其他测试来仔细检查，所有测试都运行良好。

我正在使用 iOS 12.4。

动图

此外，对于 iOS 上 Safari 的 HTML5 不兼容问题有什么好的资源建议吗？

为了三重检查，我还搜索了一些可靠的来源。最著名的是caniuse.com（没有搜索结果）和developer.mozilla，但即使他们也没有关于它的信息。

所以三重检查是行不通的。但是，由于我自己已经尝试过使用不同的 iOS 版本（8、9、10、11），它显然确实有支持，我们可以回答这个问题：

iOS Safari 是否支持 storageEvents？

是的，它确实支持 iOS 11 及更高版本的 storageEvents。
如果您有任何问题，请告诉我。

编辑#1

顺便说一句，如果你想自己测试一下（如果你不像我一样拥有 iPhone），那里有一些模拟器，比如appetize.io。

推荐阅读