Question

我将此f-tion作为“onclick”处理程序附加到<input type="file">元素：

handleWatch(event) {

  event.preventDefault();
  const file = event.target.files[0];
  if (!file) {
    return;
  }

  const reader = new FileReader();

  setInterval(() => {

    reader.onload = async function(e) {
      const content = e.target.result;

      const lines = content.split('\n').filter((line) => {
        return !line.beginsWith('#') && !(line === "");
      });
      const nLines = lines.length - 1;

      console.log("number of lines in file: " + nLines);

    }
    reader.readAsText(file, 'UTF-8');

  }, 1500);

}

我们的想法是创建一个记录器，定期检查文件内容（由用户选择）进行更改并保留到DB（为清晰起见，此代码已删除）。间隔执行工作（记录到控制台），直到内容确实发生变化，然后执行reader.onload中的所有指令。

Answer 1

从FileAPI规范中，您可以在此处阅读：https://www.w3.org/TR/FileAPI/#security-discussion

重要的安全注意事项包括防止恶意文件选择攻击（选择循环），阻止访问系统敏感文件，并防止文件修改选择发生后在磁盘上。

由于本节内容丰富，因此可能并未在所有浏览器中实施此安全功能。您使用的浏览器似乎遵循规范（我猜都是）。

我们也可以读到这个：

这是为用户代理实现的非平凡要求，而且是因此不是必须的，而应该是[RFC2119]。用户代理应该努力将File对象的快照状态设置为底层的状态在引用时存储在磁盘上。如果文件是在引用参考之后在磁盘上修改了文件的快照状态将与底层的状态不同存储。用户代理可以使用修改时间戳等保持快照状态的机制，但这是留下来的实施细节。

因此，即使浏览器在文件更改后没有阻止您，也会在用户选择文件时获取文件的快照。

使用setInterval和FileReader

1 个答案: