飞轮扩展 SDK
以自定义应用程序扩展 Flywheel UI .
开始
与国家预防机制安装
npm install @flywheel-io/extension
初始化扩展并连接到 Flywheel.
import { initExtension } from '@flywheel-io/extension';
initExtension().then(extension => {
console.log('Container Type:', extension.container.container_type);
console.log('Container ID:', extension.container._id);
console.log('File Name:', extension.file.name);
});
装入 UMD 模块
作为与国家预防机制捆绑的替代办法,SDK可以通过下列方式装入: script 标签。 图书馆可在 Flywheel 全球变量.
<body>
<pre id="content"></pre>
<script src="https://cdn.flywheel.io/sdk/extension/flywheel-extension-0.14.10.min.js"></script>
<script>
Flywheel.initExtension().then(extension => {
return extension.getFileText(extension.container, extension.file);
}).then(text => {
document.getElementById('content').innerText = text;
});
</script>
</body>
正在注册您的申请
Flywheel 站点管理员可以在站点注册扩展申请 - > 申请页. 单击注册新应用程序按钮将容器或文件类型与您的应用程序关联。 URL可以指向本地开发服务器,直到您的应用程序准备好并发布到一个公共地点.
了解更多有关申请登记的信息 飞轮 Docs。 。 。 .
扩展接口
这个 延长 实例建立扩展名的用户、容器和文件上下文。 它还提供与Flywheel相互作用的方法来获取分层的容器,检索文件数据,或者将数据保存回Flywheel. 这些方法大多返回承诺,但有些方法涉及较多(例如: 上传文件 方法)返回可订阅的可观察值.
extension.getContainer('session', extension.container.parents.session).then(session => {
extension.uploadFile(session, fileInput.files[0]).subscribe({
next: event => {
if (event.type === 'progress') {
console.log('uploaded', event.loaded, '/', event.total, 'bytes');
}
if (event.type === 'response') {
console.log('upload complete');
console.dir(event.file);
}
}
});
});
扩展范围
初始化扩展并连接到 Flywheel 实例时,您的应用程序将被设定为 仅读 默认范围。 这意味着你能够从Flywheel读取数据,但无法写入数据,例如设置自定义信息或上传文件. 如果你想选择写入功能,请通过 读取 scope 选项,连同 validateOrigin 函数,输入 initExtension编辑 验证奥里金 函数收到连接的 Flywheel 实例的出处,并将其确定为可信与否.
initExtension({ scope: 'ReadWrite', validateOrigin: origin => origin.endsWith('flywheel.io') }).then(extension => {
return extension.updateContainerInfo(extension.container, {
set: {
ProjectPolicy: {
owner: '[email protected]',
writable: true,
}
}
})
});
关闭按钮
飞轮在扩展框上画出一个关闭按钮. 为了隐藏它,通过 hideCloseButton 选项进入 initExtension 打电话 extension.close() 从你的应用程序的 自己密切控制.
initExtension({ hideCloseButton: true }).then(extension => {
document.getElementById('exit').addEventListener('click', () => extension.close());
});
数据模型
文件介绍了飞轮物体的模型。 其中最常用的有:
当通过国家防范机制在TypeScript项目中安装这个软件包时,这些定义在您的项目环境中提供.