如何在 javascript 上保存文件 url？

Question

我正在创建一个加载和显示图像的 web 应用程序。

我想要一个功能，用户可以保存他们加载的图像，这样他们就可以在以后的会话中重新加载它们，而不必再次手动设置所有内容。

为此，我曾考虑从文件中存储 url，但由于大多数浏览器的安全性，我似乎无法访问文件的 url。 我可以做些什么来保存文件的 url 或类似的东西，以便我可以在以后的会话中重新加载文件？

理想情况下，它将允许存储许多文件，因此最好保存图像的本地路径，这样就不会占用太多空间。

对于我正在使用 angular 和 tauri 的应用程序。

任何人都可以帮忙吗？ 提前非常感谢！

编辑：我发现有一种方法可以在 tauri 上使用对话框模块执行此操作，您可以在此处找到： https://tauri.studio/api/js/modules/dialog更多信息： https://github.com/ tauri-apps/wry/issues/87

如果有人读到这篇文章并使用 electron 而不是 tauri，我已经读到文件 Object 添加了路径属性，因此您可以从那里获取它。

感谢大家的帮助！

Answer 1

要存储用户下载的图像，您需要一个后端。 如果您不想运行，可以尝试将图像作为data: cookie 或本地存储中的 url，但效果不佳。

Answer 2

我最近做了一项功能来下载文件并在此处共享代码

 downloadFile(data, fileName) {
        const urlBlob = window.URL.createObjectURL(data);
        const link = document.createElement('a');
        link.href = urlBlob;
        link.setAttribute('download', fileName);
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    }

• Data 代表您的文件路径或文件 URL，fileName 代表 File save with name as you want

Answer 3

找到了答案！

我发现有一种方法可以在 tauri 上使用对话框模块执行此操作，您可以在此处找到： https://tauri.studio/api/js/modules/dialog更多信息： https://github.com/tauri-应用程序/wry/问题/87

如果有人读到这篇文章并使用 electron 而不是 tauri，我已经读到文件 Object 添加了路径属性，因此您可以从那里获取它。

Answer 4

您可以使用 cookie 来存储数据。 用户可以阻止或删除 cookie，但大多数用户（因为大多数用户使用 Chrome）默认启用 cookie。

您可以通过以下方式存储 cookie

document.imageurl = "http://example.com";

并使用

console.log(document.imageurl);

或类似的东西（变量存储在document.imageurl ）

重新加载页面时，该变量将保留在那里。