调试 Filesystem API

HTML5 文件系统是一款强大的 API。能力越强，复杂性就越高。复杂性会带来更多调试挫折。很遗憾，Chrome DevTools目前不支持 Filesystem API。这会使调试变得比应有的更困难。所谓“困难”，是指需要编写代码来列出/移除文件系统中的文件。

在使用 Filesystem API 的探索过程中，我学到了一些技巧，现在想分享给大家。每条提示都有自己的局限性，但将这些提示组合使用，可以解决 90% 的问题。以下是前 5 名：

1. 确保您不是从 file:// 运行。这是一个很狡猾的错误，许多人都中招了。Chrome 会对 file:// 施加重大安全限制。如果您在 file:// 中本地运行应用，许多高级文件 API（BlobBuilder、FileReader、文件系统 API 等）都会抛出错误或静默失败。如果您手边没有 Web 服务器，可以使用 --allow-file-access-from-files 标志启动 Chrome 来绕过此安全限制。此标志仅用于测试目的。

2. 可怕的 SECURITY_ERR 或 QUOTA_EXCEEDED_ERR。当您尝试写入数据，但受到第 1 点的影响时，通常会发生这种情况。如果不是这种情况，则可能是因为您没有配额。文件系统可通过两种类型的配额打开，即 TEMPORARY 或 PERSISTENT。如果您使用的是后者，用户需要明确向您的应用授予永久性存储权限。如需了解如何执行此操作，请参阅这篇文章。

3. filesystem: 网址 FTW。您可以轻松打开应用源代码根 DirectoryEntry 的 filesystem: 网址。这是什么意思？例如，如果您的应用位于 www.example.com，请在新标签页中打开 filesystem:http://www.example.com/temporary/。Chrome 会显示存储应用来源的文件/文件夹的只读列表。如需详细了解 filesystem: 网址，请参阅 https://www.html5rocks.com/en/tutorials/file/filesystem/#toc-filesystemurls。

4. chrome://settings/cookies 是您的好友。您可通过此页面彻底清除为某个来源存储的数据。其中包括数据库存储空间、AppCache、Cookie、localStorage 以及 FileSystem API 中的内容。不过请注意，这是一个要么全部迁移，要么不迁移的操作。您无法仅移除一个文件或部分数据。

5. 别忘了错误回调。文件系统 API 位于异步世界中（除非您在 Worker 中使用同步版本）。在 API 调用中始终使用错误回调。这些步骤是可选的，但如果您不执行这些步骤，日后出现问题时可能会给您带来很多麻烦。