Javascript 跨浏览器实例/页面刷新持久访问本地文件

Question

我正在寻找一种方法，允许用户使用标准元素选择文件，并允许浏览器跨页面刷新和/或浏览器实例持续访问该文件。

设想：

• 我们有一个网络应用程序想要授权给用户。
• 我们希望向用户发送他们保存到本地计算机的许可证文件。
• 他们第一次访问我们的网络应用程序时，他们使用一个字段来选择计算机上的本地许可证文件
• 随后每次访问该应用程序时（无论是关闭浏览器、重新启动计算机等），它都可以直接读取许可证文件，而不需要用户重新选择该文件。

我们不想使用 localStorage 来存储整个文件，因为文件的最大大小不受限制，并且可能会超出 localStorage 的大小限制。

我已经部分成功：只要原始浏览器选项卡打开，任何其他浏览器实例或选项卡都可以访问该文件并读取它。但是，如果关闭原始选项卡，本地文件 URL 将被破坏。

这是我完成这部分的方法：

• 当用户从字段中选择文件时，使用 window.createObjectURL() 函数为所选文件创建对象 URL。
• 将此对象 URL 保存在 localStorage 中

每当另一个浏览器实例/选项卡访问此 URL 时，它都可以使用 XHR 对象和 FileReader 对象加载文件。这是一段代码：

var xhr = new XMLHttpRequest();
console.log("Reading URL: " + localStorage.savedFile);
xhr.open('GET', localStorage.savedFile, true);
xhr.responseType = 'blob';
xhr.onreadystatechange = function(e)
{
    if (xhr.readyState == 4)
    {
        var myBlob = this.response;
        console.log(myBlob);
        var f = new FileReader();
        f.onload = function(e) { console.log(e); alert("Data read: " + e.target.result); };
        f.readAsText(myBlob);

    }
};
xhr.send();

正如您所看到的，xhr 对象返回一个 blob，并且可以将其直接发送到 FileReader 对象以读取数据。

只要原始选项卡（他们选择文件的选项卡）打开，此功能就可以完美运行。但显然，createObjectURL() 生成的 URL 在关闭选项卡时会被销毁（从垃圾收集的角度来看，这是有意义的）。

任何人都可以想出一种方法来跨实例/选项卡保留 URL，而不需要使原始选项卡保持打开状态，并允许访问同一本地文件，而无需用户每次访问应用程序时手动选择它？

Answer 1

这与单点登录非常相似，但有额外的验证。

这是一种解决方案：

• 创建许可证的哈希值（或加密“许可证密钥”，即许可证的一些唯一标识符）
• 将哈希值存储在 cookie 或本地存储中
• 还将哈希值传递给服务器并保存哈希值和客户端之间的映射以及上次访问的日期/时间
• 每次用户登录时，验证 cookie 或本地存储中是否存在哈希条目以及哈希的有效性。您可能还想执行额外的验证列表上次使用的、客户端的数量等。