在此步骤中,您将学习以下内容:
- 如何获取对外部文件系统中文件的引用。
- 如何写入文件系统。
完成此步骤预计用时:20 分钟。
若要预览您将在此步骤中完成的内容,请跳转到本页底部 ↓。
导出待办事项
此步骤将向应用添加一个导出按钮。点击时,当前的待办事项会保存到文本中 所有文件如果该文件已存在,系统会将其替换。否则,系统会创建一个新文件。
更新权限
对于只读权限,可以采用字符串形式请求文件系统权限,也可以使用 其他属性例如:
// Read only
"permissions": ["fileSystem"]
// Read and write
"permissions": [{"fileSystem": ["write"]}]
// Read, write, autocomplate previous input, and select folder directories instead of files
"permissions": [{"fileSystem": ["write", "retainEntries", "directory"]}]
您需要拥有读写权限。在 manifest.json 中,请求 {fileSystem: [ "write" ] }
权限:
"permissions": [
"storage",
"alarms",
"notifications",
"webview",
"<all_urls>",
{ "fileSystem": ["write"] }
],
更新 HTML 视图
在 index.html 中,添加导出到磁盘按钮和 div(应用会显示状态消息):
<footer id="info">
<button id="toggleAlarm">Activate alarm</button>
<button id="exportToDisk">Export to disk</button>
<div id="status"></div>
...
</footer>
同样在 index.html 中,加载 export.js 脚本:
...
<script src="js/alarms.js"></script>
<script src="js/export.js"></script>
创建导出脚本
使用以下代码新建一个名为 export.js 的 JavaScript 文件。将其保存在 js 文件夹中。
(function() {
var dbName = 'todos-vanillajs';
var savedFileEntry, fileDisplayPath