Question

我想创建插件机制。是的，你可以在我的网站上加载js文件并运行你的js＆＃34;插件＆＃34; （函数）当此插件设置为运行时（切换为运行）。

所有这些我想做的没有任何服务器。

我的意思是，我想保留localstorage js文件或此文件的路径。

看起来很难，因为js无法轻松访问文件路径。

我按<input type="file"/>

处理文件

我对onchange事件作出反应。我通过event.srcElement.files[0]

找到了可以找到所选文件的事件

我可以通过以下方式创建该对象的URL：URL.createObjectURL(event.srcElement.files[0])

我尝试将该URL存储在localstorage中，但此URL是临时的。此外，我尝试存储整个事件或仅存档（event.srcElement.files[0]）。

但是如果我想把它放到函数.setItem中我需要创建字符串：

localStorage.setItem("functionURL", JSON.stringify(this.functionURL));

.toString()创建[Object Event/File]

JSON.stringify()从{}

创建[Object Event/File]

那么，也许有办法以某种方式记住我们可以在没有任何服务器的情况下使用的文件？

Answer 1

那么，也许有办法以某种方式记住我们可以在没有任何服务器的情况下使用的文件？

基本上没有。 :-) Web存储只存储字符串。出于明显的安全原因，您无法使用字符串从您的网页访问用户本地文件系统上的文件。

你可以改为：

让他们可以上传＆＃34;将文件放入页面（不服务器），让文件在input[type=file]中标识文件，阅读文本（通过File API），然后将文本存储到本地存储
在页面加载时，如果本地存储有代码要运行，请运行它
为用户提供删除或更新他们上传到页面的代码的方法

由于所有这些都发生在浏览器中，因此您不需要服务器。

网络存储确实有大小限制，尽管它们非常慷慨（大约2.5-5MB）和每个来源，所以你主要依靠自己。但是如果你遇到这些限制，你可以通过service worker缓存这些文件来进一步提高它，但复杂性显着提高。我从网络存储开始，如果你真的需要支持大量文件，那就继续前进。

＃1（通过input[type=file]读取用户识别的脚本文件）非常简单：

var file = input.files[0];
var fr = new FileReader();
fr.onload = function() {
    // Use `fr.result` here, it's a string containing the text
};
fr.readAsText(file);

在localStorage中保存有关js文件的信息

1 个答案: