Storage APIs

警告
重要提示：Chrome 将在所有平台上取消对 Chrome 应用程序的支持。 Chrome 浏览器和 Chrome 网上应用店将继续支持扩展。阅读公告并了解有关迁移应用程序的更多信息。

应用程序开发的几乎每个方面都涉及发送或接收数据的某些元素。从基础开始，您应该使用 MVC 框架来帮助您设计和实现您的应用程序，以便数据与该数据的应用程序视图完全分开（请参阅 MVC Architecture）。

您还需要考虑当您的应用离线时如何处理数据（请参阅Offline First）。本文档简要介绍了本地发送、接收和保存数据的存储选项；文档的其余部分向您展示了如何使用 Chrome 的文件系统和同步文件系统 API（另请参阅 fileSystem API 和 syncFileSystem API）。

API 示例：想玩玩代码吗？查看filesystem-access、syncfs-editor和storage示例。

# Storage options(存储选项)

打包的应用程序使用许多不同的机制来发送和接收数据。对于外部数据（资源、网页），需要了解内容安全策略（CSP）。与 Chrome 扩展程序类似，您可以使用cross-origin XMLHttpRequests 与远程服务器进行通信。您还可以隔离外部页面，以便应用程序的其余部分是安全的（请参阅嵌入外部网页）。

在本地保存数据时，可以使用 Chrome Storage API 保存少量字符串数据，使用 IndexedDB 保存结构化数据。使用 IndexedDB，您可以将 JavaScript 对象持久化到对象存储并使用存储的索引来查询数据（要了解更多信息，请参阅 HTML5 Rock 的简单待办事项列表教程）。对于所有其他类型的数据，如二进制数据，请使用文件系统和同步文件系统 API。

Chrome 的文件系统和同步文件系统 API 扩展了 HTML5 FileSystem API 。使用 Chrome 的文件系统 API，应用程序可以创建、读取、导航和写入用户本地文件系统的沙盒部分。例如，照片共享应用程序可以使用文件系统 API 来读取和写入用户选择的任何照片。

借助 Chrome 的同步文件系统 API，应用程序可以在用户的 Google Drive 上保存和同步数据，以便不同客户端可以使用相同的数据。例如，云支持的文本编辑器应用程序可以自动将新文本文件同步到用户的 Google Drive 帐户。当用户在新客户端中打开文本编辑器时，Google Drive 会将新文本文件推送到文本编辑器的该实例。

注意：与常规文件系统 API 不同，Chrome 的同步文件系统 API 目前不支持目录操作，除了读取根目录中的目录条目。尝试在同步文件系统中创建目录将导致 INVALID_MODIFICATION_ERROR。

# Using the Chrome Filesystem API(使用 Chrome 文件系统 API)

# Adding file system permission(添加文件系统权限)

使用Chrome的File System API，需要在manifest中添加“fileSystem”权限，这样你就可以从用户那里获得存储持久数据的权限。

"permissions": [
  "...",
  "fileSystem"
]

# User-options for selecting files(用于选择文件的用户选项)

用户希望以与往常相同的方式选择文件。至少，他们希望有一个“选择文件”按钮和标准的文件选择器。如果您的应用大量使用文件处理，您还应该实现拖放（请参阅下文并查看原生 HTML5 拖放）

# Obtaining the path of a fileEntry(获取fileEntry的路径)

要获取用户选择的文件的完整路径，fileEntry，请调用 getDisplayPath()：

function displayPath(fileEntry) {
  chrome.fileSystem.getDisplayPath(fileEntry, function(path) {
    console.log(path)
  });
}

# Implementing drag-and-drop(实现拖放)

如果您需要实现拖放选择，文件系统访问（filesystem-access）示例中的拖放文件控制器（dnd.js）是一个很好的起点。控制器通过拖放从 DataTransferItem 创建一个文件条目。在此示例中，fileEntry 设置为第一个放置的项目。

var dnd = new DnDFileController('body', function(data) {
  var fileEntry = data.items[0].webkitGetAsEntry();
  displayPath(fileEntry);
});

# Reading a file(读取文件)

以下代码打开文件（只读）并使用 FileReader 对象将其作为文本读取。如果文件不存在，则抛出错误。

var chosenFileEntry = null;

chooseFileButton.addEventListener('click', function(e) {
  chrome.fileSystem.chooseEntry({type: 'openFile'}, function(readOnlyEntry) {

    readOnlyEntry.file(function(file) {
      var reader = new FileReader();

      reader.onerror = errorHandler;
      reader.onloadend = function(e) {
        console.log(e.target.result);
      };

      reader.readAsText(file);
    });
    });
});

# Writing a file(写文件)

写入文件的两个常见用例是“保存”和“另存为”。以下代码从只读的 selectedFileEntry创建 writableEntry 并将所选文件写入其中。

chrome.fileSystem.getWritableEntry(chosenFileEntry, function(writableFileEntry) {
    writableFileEntry.createWriter(function(writer) {
      writer.onerror = errorHandler;
      writer.onwriteend = callback;

    chosenFileEntry.file(function(file) {
      writer.write(file);
    });
  }, errorHandler);
});

以下代码创建一个具有“另存为”功能的新文件，并使用 writer.write()方法将新 blob 写入文件。

chrome.fileSystem.chooseEntry({type: 'saveFile'}, function(writableFileEntry) {
    writableFileEntry.createWriter(function(writer) {
      writer.onerror = errorHandler;
      writer.onwriteend = function(e) {
        console.log('write complete');
      };
      writer.write(new Blob(['1234567890'], {type: 'text/plain'}));
    }, errorHandler);
});

# Using the Chrome Sync Filesystem API(使用 Chrome 同步文件系统 API)

使用可同步的文件存储，返回的数据对象可以在 FileSystem API 中以与本地离线文件系统相同的方式操作，但添加（和自动）将该数据同步到 Google Drive。

# Adding sync file system permission(添加同步文件系统权限)

要使用 Chrome 的 Sync Filesystem API，您需要在 manifest 中添加“syncFileSystem”权限，以便您可以从用户那里获得存储和同步持久数据的权限。

"permissions": [
  "...",
  "syncFileSystem"
]

# Initiating syncable file storage(启动可同步文件存储)

要在您的应用程序中启动可同步文件存储，只需调用 syncFileSystem.requestFileSystem。此方法返回由 Google Drive 支持的可同步文件系统，例如：

chrome.syncFileSystem.requestFileSystem(function (fs) {
   // FileSystem API should just work on the returned 'fs'.
   fs.root.getFile('test.txt', {create:true}, getEntryCallback, errorCallback);
});

# About file sync status(关于文件同步状态)

使用 syncFileSystem.getFileStatus 获取当前文件的同步状态：

chrome.syncFileSystem.getFileStatus(entry, function(status) {...});

文件同步状态值可以是以下之一：'synced', 'pending', 或者 'conflicting'. 'Synced' 表示文件完全同步；没有未同步到 Google 云端硬盘的待处理本地更改。但是，Google Drive 端可能存在尚未提取的待处理更改。

“待处理(Pending)”表示文件有待处理的更改尚未同步到 Google 云端硬盘。如果应用程序在线运行，本地更改（几乎）会立即同步到 Google Drive，并且 syncFileSystem.onFileStatusChanged 事件会以“已同步(synced)”状态触发（有关更多详细信息，请参见下文）。

当文件的状态更改为“冲突(conflicting)”时，将触发 syncFileSystem.onFileStatusChanged。 “Conflicting”意味着本地存储和 Google 云端硬盘上的更改存在冲突。仅当冲突解决策略设置为“手动(manual)”时，文件才能处于此状态。默认策略是“last_write_win”，冲突由简单的 last-write-win 策略自动解决。可以通过syncFileSystem.setConflictResolutionPolicy 更改系统的冲突解决策略。

如果冲突解决策略设置为“手动manual”并且文件导致“冲突conflicting”状态，应用程序仍然可以将文件作为本地离线文件进行读写，但更改不会同步，并且该文件将与在其他客户端上进行的远程更改保持分离，直到解决冲突。解决冲突的最简单方法是删除或重命名文件的本地版本。这会强制同步远程版本，解决冲突状态，并以“同步synced”状态触发 onFileStatusChanged 事件。

# Listening for changes in synced status(监听同步状态的变化)

当文件的同步状态更改时，将触发 syncFileSystem.onFileStatusChanged 事件。例如，假设文件有待处理的更改并且处于“待处理pending”状态。该应用程序可能已处于离线状态，以便即将同步更改。当同步服务检测到待处理的本地更改并将更改上传到 Google Drive 时，该服务使用以下值触发 onFileStatusChanged 事件：{ fileEntry:a fileEntry for the file, status: 'synced', action: 'updated', direction: 'local_to_remote' }。

同样，无论本地活动如何，同步服务都可能检测到另一个客户端所做的远程更改，并将更改从 Google Drive 下载到本地存储。如果远程更改是为了添加新文件，则会触发具有以下值的事件：{ fileEntry: a fileEntry for the file, status: 'synced', action: 'added', direction: 'remote_to_local' }

如果本地和远程端对同一个文件都有冲突的更改，并且如果冲突解决策略设置为“手动manual”，则文件状态更改为冲突conflicting状态，从同步服务中分离，并且在冲突解决之前不会同步。在这种情况下，将触发具有以下值的事件：{ fileEntry: a fileEntry for the file, status: 'conflicting', action: null, direction: null }。

您可以为此事件添加一个侦听器，以响应状态的任何更改。例如，Chrome Music Player应用程序会收听从 Google Drive 同步但尚未导入到特定客户端上用户本地存储的任何新音乐。找到的任何音乐都会同步到该客户端：

chrome.syncFileSystem.onFileStatusChanged.addListener(function(fileInfo) {
  if (fileInfo.status === 'synced') {
    if (fileInfo.direction === 'remote_to_local') {
      if (fileInfo.action === 'added') {
        db.add(fileInfo.fileEntry);
      } else if (fileInfo.action === 'deleted') {
        db.remove(fileInfo.fileEntry);
      }
    }
  }
});

# Checking API usage(检查 API 使用情况)

要检查 API 使用的数据量，请查询应用程序的本地沙盒目录或 syncFileSystem.getUsageAndQuota 返回的使用字节数：

chrome.syncFileSystem.getUsageAndQuota(fileSystem, function (storageInfo) {
   updateUsageInfo(storageInfo.usageBytes);
   updateQuotaInfo(storageInfo.quotaBytes);
});

您还可以查看用户的同步后端服务存储（在 Google Drive 中）。同步的文件保存在一个隐藏的 Google Drive 文件夹中，Chrome Syncable FileSystem。该文件夹不会显示在您的“我的云端硬盘”列表中，但可以通过在搜索框中搜索文件夹名称来访问。（请注意，不保证远程文件夹布局在版本之间保持向后兼容。）

By.一粒技术服务

Storage APIs

Storage APIs

# Storage options(存储选项)

# Using the Chrome Filesystem API(使用 Chrome 文件系统 API)

# Adding file system permission(添加文件系统权限)

# User-options for selecting files(用于选择文件的用户选项)

# Obtaining the path of a fileEntry(获取fileEntry的路径)

# Implementing drag-and-drop(实现拖放)

# Reading a file(读取文件)

# Writing a file(写文件)

# Using the Chrome Sync Filesystem API(使用 Chrome 同步文件系统 API)

# Adding sync file system permission(添加同步文件系统权限)

# Initiating syncable file storage(启动可同步文件存储)

# About file sync status(关于文件同步状态)

# Listening for changes in synced status(监听同步状态的变化)

# Checking API usage(检查 API 使用情况)

results matching ""

No results matching ""