Microsoft Edge:本地/会话存储在新选项卡中不起作用

Question

我正在处理一个托管在Azure中的Web应用程序。我在MS Edge (内部版本20.10525.0.0)上尝试过，得到了以下问题。

我有一个与目标_blank的链接，可以在新的选项卡中打开一个页面。在此链接的单击事件上，我在会话存储中存储了一些数据。新页面正在检索数据以显示它。在Chrome，Firefox，IE 9-10-11下都能正常工作。

在Edge下，存储似乎工作得很好。认为，检索并不总是有效的。有时，第一次尝试是有效的。有时，它会返回null。

我尝试使用本地存储而不是会话存储。我还尝试对目标_blank使用window.open。这两种解决方案都不起作用。

有谁有主意吗？

Answer 1

我在多个选项卡上使用localStorage时也遇到了同样的问题--它只能断断续续地工作，或者根本不工作。我的解决方案是切换到window.indexedDB (参见docs on MDN)，它在IE10，IE11和MS Edge (在Edgev20.10240上测试)上运行良好。

Answer 2

如果窗口A创建了窗口B，则会触发存储事件

用下面的代码试用一下

创建一个名为a.htm的文件，并将此脚本添加到

(function() {
    function write(s) {
        var d = document.createElement('div');
        d.innerHTML = s;
        document.body.appendChild(d);
    }

    var w = window.open('','window_b');
    if (w.location.host === '') {
        w.location.href = 'http://localhost/b.htm';
    }

    if (window.localStorage) {
        setInterval(function() {
            var now = (new Date()).toTimeString();
            localStorage.removeItem('date');
            localStorage.setItem('date', now);
            write('fired on ' + now);
        }, 3000);
    }
    else {
        write('local storage not detected!');
    }
})();

创建一个名为b.htm的文件并添加以下脚本

(function() {
    function write(s) {
        var d = document.createElement('div');
        d.innerHTML = s;
        document.body.appendChild(d);
    }

    window.addEventListener('storage', function(e) {  
        e.newValue && write('received ' + e.newValue);
    });

})();

然后只需浏览到a.htm