[英]How do a web application access local file?
I am trying to have a web application access local files.我正在尝试让 web 应用程序访问本地文件。 A web IDE like vscode can directly change or rename local files.
一个web IDE之类的vscode可以直接更改或重命名本地文件。 While vscode doesn't seem to use a tag like
<input type="file" />
虽然 vscode 似乎没有使用像
<input type="file" />
这样的标签
My hope is to load a local directory and control the files like remove/rename through my web application.我希望通过我的 web 应用程序加载本地目录并控制文件,如删除/重命名。 The web IDE's solution may provide some reference.
web IDE的解决方案可以提供一些参考。
How does vscode access the local file? vscode如何访问本地文件?
vscode.dev uses the File System Access API , which allows web applications to directly read and modify the filesystem. vscode.dev使用文件系统访问 API ,它允许 web 应用程序直接读取和修改文件系统。
Rather than using a <input type="file" />
, it calls window.showOpenFilePicker()
to get a FileSystemFileHandle
, which can then, in turn, be read and converted into a FileSystemWritableFileStream
to which the browser can write and save files.它不是使用
<input type="file" />
,而是调用window.showOpenFilePicker()
来获取FileSystemFileHandle
,然后可以读取该文件句柄并将其转换为浏览器可以写入和保存文件的FileSystemWritableFileStream
。 Similarly, the API can handle directories and browse the file hierarchy.同样,API 可以处理目录和浏览文件层次结构。
Of course, this is a simplification, as I could not possibly go through every detail of the API in this answer.当然,这是一种简化,因为我不可能 go 通过此答案中 API 的每个细节。 The MDN article has a lot of examples and thorough documentation that you will want to read through.
MDN 文章有很多示例和详尽的文档,您将需要通读。 For testing, it should be noted that the API is only available on sites served through HTTPS, so you're going to need to set up SSL for your
localhost
.对于测试,应注意 API 仅在通过 HTTPS 提供服务的站点上可用,因此您需要为
localhost
设置 SSL。 Also, the API is not available in all browsers, so be sure to check the compatibility table .此外,API 并非在所有浏览器中都可用,因此请务必查看兼容性表。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.