上文提到，最近开发了 sync-to-xlog 这个 obsidian 插件，和官方成员沟通了一波，发现 xlog 官方也在维护一个插件，还在相当原始的 demo 阶段，验证想法中。目标功能更强大完整，厚着脸皮也要到了编辑权限。
那我们就克隆跑一跑。
期待我可以从官方插件里学到什么，可以从中看到更多 crossbell/xlog 一些系统设计和用法。
使用介绍#
更友好的登录鉴权#
设置页面补充 login 唤起一个登录页面，得到相关 token token，体验那是贼好，不 hack。
发现是个标准的 jwt，也看到了不少优化点。
上图一个 SettingsTab
web view 信息展示#
左侧注册了一个 Robin Icon，点击之后右侧展开一个 web-view，基础信息摆一摆。
看描述想在本地编辑、上传下载、xlog 网页打开。
翻源码#
从入口文件看到
- AppPlugin 插件核心
- SampleModal
- 设置页面 SettingsTab
- 注册右下角的 statusBar
- 自定义 icon
- 所有的 web view 是手写的，那应该就比较累了
- api 部分维护了 Class Indexer
- 用户登录区分 op 授权和 email 授权
- newbie 的 token 属于 email ，原来如此！
- siwe 的 token 属于钱包操作，这里是我的授权方案
- 对上号了
- ribbon 图片是写死的 svg，也没黑科技
- 挂载右侧 webview 的时候，用到的是 workspace.revealLeat 看着还是失焦那一套
- 命令注册。注册了一个空 modal
- 设置页面注册 protocolHandler 方便传递 token，挺好
- 维护了 mapping-manager 做本地设置和远程 post 做关联，通过简单的 slug 进行对比
- 尝试监听 metadataCache 的相关事件
这里 webview 是手搓的，心疼作者一秒，这玩意应该用框架，尤其是想到 list 都是自己手搓 for 循环，就更心疼了... 幸好我已经掌握了。
官方实现信息的思路#
token#
获取 token 的部分可以稍后确认，反正都是拿 token，和 swie 的 token 一个效果
获取 xlog 内容#
这里走的 crossbell 的 sdk，理论上更舒服更安全。
创建 createIndeer 的啥时候没有携带 token？ 那只能获取公开的只读的了，那咋操作，存疑。
站点信息。通过 indexer.character.get(charId) 获取首页基本信息，头像部分做个回退默认头像。
获取所有 Post ，通过 indexer.note.getMany 获取。
没了。没啥黑科技。
展示 ipfs 时候写死的网站 replace
上传文件是用的 sdk，应该可以参考借鉴。
有价值的代码块#
// 操作 frontmatter
this.plugin.app.fileManager.processFrontMatter
// upload image to ipfs
import { ipfsUploadFile } from 'crossbell/ipfs'
export function uploadFile(file: File | Blob) {
return ipfsUploadFile(file)
}
// reg protocol
this.plugin.registerObsidianProtocolHandler('xlog-login', async (data) => {}))
// html href 这样写
// obsidian://xlog-login?token=xxx&characterId=xx&type=op/
本文通过 sync-to-xlog 插件轻松完成同步！