返回

Chrome 92：网络应用程序作为文件处理器的新功能

前端

引言

网络应用程序 (PWA) 已成为移动和桌面设备上一种日益流行的应用程序类型。它们提供了与本机应用程序类似的功能，但不需要安装，并且可以从任何网络浏览器访问。

Chrome 92 引入了一项新功能，允许 PWA 作为文件处理器。这项功能使 PWA 能够打开、编辑和保存本地文件，而无需将其下载到本地设备。这对于提高生产力非常有用，因为它允许用户直接从浏览器处理文件，而无需在应用程序和设备之间切换。

文件处理器 API

文件处理器 API 是一组允许 PWA 访问本地文件系统的 API。这些 API 使 PWA 能够：

  • 打开、读取和写入文件
  • 创建和删除文件
  • 创建和删除目录
  • 移动和重命名文件和目录

使用文件处理器 API

要使用文件处理器 API，PWA 必须请求 file-handling 权限。此权限允许 PWA 访问用户的本地文件系统。

一旦获得权限，PWA 可以使用 FileSystemHandle 和 FileSystemDirectoryHandle 对象来访问本地文件系统。这些对象表示文件或目录，并提供用于执行文件操作的方法。

例如，以下代码显示了如何使用文件处理器 API 打开文件：

async function openFile() {
  const handle = await window.showOpenFilePicker();
  const file = await handle.getFile();
  const contents = await file.text();
  console.log(contents);
}

应用程序

文件处理器 API 可以用于各种应用程序，包括：

  • 文本编辑器
  • 图像编辑器
  • 音频和视频播放器
  • 文件管理应用程序

示例

以下是一些使用文件处理器 API 构建的示例应用程序：

  • Text Editor ：这是一个简单的文本编辑器，允许用户创建、编辑和保存文本文件。
  • Image Editor ：这是一个图像编辑器，允许用户打开、编辑和保存图像文件。
  • Audio Player ：这是一个音频播放器，允许用户打开和播放音频文件。

结论

文件处理器 API 是 Chrome 92 中一项功能强大的新功能，它使 PWA 能够打开、编辑和保存本地文件。这项功能对于提高生产力非常有用，因为它允许用户直接从浏览器处理文件，而无需在应用程序和设备之间切换。随着 PWA 变得越来越强大，我们可以期待在未来看到更多创新的文件处理应用程序。