如果您的应用托管在 App Engine 上,则可以使用 Cloud Storage 服务来保存、加载、共享和发布程序。
设置 App Engine
第一个目标是在 App Engine 上运行您自己的 Blockly 副本。
- 下载并安装 Python SDK。
- 登录 Google App Engine 并创建一个应用。
- 修改
appengine/app.yaml
并将应用 ID 从blockly-demo
更改为您在上一步中创建的应用名称。 - 将以下文件和目录复制(或软链接)到
appengine/static/
:demos/
msg/
media/
*_compressed.js
- 可选:如果您想要在服务器上使用
blockly_uncompressed.js
,那么也请将该文件复制到appengine/static/
,并将core
复制到appengine/static/
。 - 可选:如果您想要运行 Blockly 园地,则必须复制
blocks
、generators
和tests
目录,以及第 5 步中的文件。 - 从 GUI 运行 Google App Engine 启动器,将
appengine
目录添加为现有应用,然后按“部署”按钮。如果您更喜欢使用命令行,请运行:appcfg.py --oauth2 update appengine/
。
上传 Blockly 后,您可以将浏览器指向您在第 2 步中创建的网址。您应该会看到一份演示列表,包括 Cloud Storage 演示。
与云交谈
检查 demos/storage/index.html 中的存储演示源代码,并注意以下功能。首先,有一个用于加载 Cloud Storage API 的脚本:
<script src="/storage.js"></script>
请注意,此脚本假定页面上只有一个 Blockly 工作区。还有下面这些消息定义,您应该根据需要进行修改:
BlocklyStorage.HTTPREQUEST_ERROR = 'There was a problem with the request.\n'; BlocklyStorage.LINK_ALERT = 'Share your blocks with this link:\n\n%1'; BlocklyStorage.HASH_ERROR = 'Sorry, "%1" doesn\'t correspond with any saved Blockly file.'; BlocklyStorage.XML_ERROR = 'Could not load your saved file.\n' + 'Perhaps it was created with a different version of Blockly?';
您可以在 json 目录中的 Blockly Games 中找到这些消息的其他语言翻译。
保存当前代码块是对 BlocklyStorage.link()
的单个调用:
<button onclick="BlocklyStorage.link()">Save Blocks</button>
若要在网页加载时恢复已保存的代码块,只需在 Blockly 注入后使用网址的哈希值调用 BlocklyStorage.retrieveXml
即可:
if ('BlocklyStorage' in window && window.location.hash.length > 1) { BlocklyStorage.retrieveXml(window.location.hash.substring(1)); }
本地存储空间
storage.js
API 还能够在浏览器的本地存储空间中保存一组代码块。您可以采用这种方法来替代使用云存储,也可以结合使用云存储(但在后一种情况下,必须注意这两种尝试同时恢复的存储类型)。
如需从本地存储空间恢复块,请在注入 Blockly 后,在超时后立即调用 BlocklyStorage.restoreBlocks
。
setTimeout(BlocklyStorage.restoreBlocks, 0);
如需在用户离开页面时将数据块备份到本地存储空间,请调用 BlocklyStorage.backupOnUnload
,它会在页面的卸载事件中注册事件监听器。
BlocklyStorage.backupOnUnload();
示例
这里是 Cloud Storage 的实时演示。