Question

我在网页上有一个文件结构，并寻找以下场景的解决方案：

所选文件应下载到浏览器缓存中并打开（如果是excel文档，则使用excel打开等）。现在，当用户更改文件时，应检测到该文件并再次上载文件。

这是否可以使用JavaScript？如果是，我在哪里存储文件（临时网络文件夹？）以及如何检测更改？

Answer 1

你描述它的方式：不，这在JavaScript中是不可能的听起来你想要一个FTP客户端。

当用户更改文件时，应检测该文件并再次上传文件。

由于JS几乎无法访问文件系统，因此无法实现您可以访问文件的唯一方法是请求用户选择一个文件，请参阅：
How to open a local disk file with Javascript?

所以你能做的最多就是：

下载文件。
基于浏览器＆amp;设置，文件可以自动打开，也可以不打开。
向用户显示一个文件选择对话框，他们可以在完成编辑后使用它。
将所选文件与服务器上的文件进行比较，如果已更改则上传。

下载文件后，您无法控制它对于已注册协议的应用程序（例如，steam://），您可能请求在程序中打开的URL，但这需要{{1}每个文件类型/程序。
检测文件更改根本不可能（因为您无法访问该文件），并且再次上载需要用户使用文件对话框手动选择文件。

Answer 2

使用它的唯一方法是让用户选择下载的文件，然后检查修改。

HTML

<label for="excelFile">Select the excel file: </label><input type="file" id="excelFile" />

JS

//Change event to detect when the user has selected a file
document.querySelector("#excelFile").addEventListener("change",function(e){
   //get the selected file
   var file = this.files[0];

   //get the last modified date
   var lastModified = file.lastModified;

   //check lastModified against stored lastModified
   //this assumes you store the last mod in localStorage
   if(localStorage['excelLastMod'] < lastModified){
       //It has modified update last mod
       localStorage['excelLastMod'] = lastModified;

       //do upload
   }
});

如果您知道自己的用户使用的是Chrome，则可以使用Chrome's FileSystem api

Answer 3

感谢您的帮助和想法。我看到了一个软件（https://www.group-office.com/），它包含了这个功能，所以必须要这样做。

新主意，使用chrome文件系统api（@Siguza已经说过）：

使用filesystem api
在本地打开文件（应该使用文件系统：http://www.example.com/persistent/info.txt，或？）
每隔x秒轮询一次文件的最后更改
如果检测到更改，则将文件上传回服务器数据库

我看到excel锁定文件Check if file has changed using HTML5 File API时遇到一些问题但除此之外，这应该有效，不应该吗？

Js - 缓存文件，打开它，检测更改并上传

3 个答案: