javascript - 检查本地文件是否已更改

Question

这个问题在这里已经有了答案:





Check if file has changed using HTML5 File API

(3 个回答)


去年关闭。




我有一个 Web 应用程序，用户可以在其中使用 html5 FileReader API 选择本地文件作为输入。 .有什么方法可以检查文件是否已更改，是否适用于现代浏览器？
从历史上看，通过轮询文件对象并比较 File.lastModifiedDate 在某些浏览器中是可能的。 (已弃用)或 File.lastModified属性，如本 QA 中所述:Check if file has changed using HTML5 File API .但是，规范说 lastModifiedDate和其他文件数据应该是文件的快照，就像用户第一次选择它时的样子一样，所以这不应该起作用(而且似乎大多数浏览器的最新版本现在确实遵循规范，因此无法使用此 hack)。
我希望能够通过阅读文件来检查更改。这种工作，但是一旦文件在磁盘上被更改，Chrome 和 Firefox 就会抛出一个错误说 DOMException: The requested file could not be read, typically due to permission problems that have occurred after a reference to a file was acquired. 有没有办法解决？
这是我尝试过的:

let oldText

setInterval(function () {
  const fileObj = document.getElementById('myFileInput').files[0]
  const reader = new FileReader()
  reader.onload = evt => {
      const text = evt.target.result
      if (text !== oldText) {
        console.log("The file has changed!")
        oldText = text
      }
    }
    reader.readAsText(fileObj)
}, 1000)

...或更简单:

const fileObj = document.getElementById('myFileInput').files[0]
const reader = new FileReader()
reader.readAsText(fileObj)  // works
// now lets edit the file and try again
reader.readAsText(fileObj)  // fails

reader.readAsText()按预期工作，直到文件被更改，当它抛出上述错误时。我想这是一种安全措施，尽管我不完全理解它试图保护用户免受什么侵害。我可以做什么？

Answer 1

如果/当 Native File System 时，这将再次成为可能API 在浏览器中实现。它将是 partially enabled在 Google Chrome 85 中，计划于 2020 年 10 月发布。
与 FileReader API 不同，它需要明确的用户交互，因此您可以执行以下操作:

myFileInput.addEventListener('change', async (e) => {
  const fh = await window.chooseFileSystemEntries()
  // fh is now a FileSystemFileHandle object
  // Use fh.getFile() to get a File object
})