如何用JavaScript访问剪贴板源URL？Obsidian插件开发需求

问题背景 #

我正在开发Obsidian插件，目标实现类似OneNote的功能——粘贴内容时自动附加该内容的原始上下文源URL。OneNote的这个功能基于CF_Html格式，旧文档曾提到Source URL变量，虽然新文档已移除该说明，但OneNote至今仍在使用。

我试过用Clipboard API读取text/html、text/plain类型，只能拿到复制的内容，得不到源URL；尝试application/octet-stream类型也没效果。

核心解决方案：解析CF_Html格式的完整HTML数据 #

浏览器在复制网页内容时，会把完整的CF_Html格式数据写入剪贴板的text/html类型中，其中就包含源URL（存在头部的SourceURL字段）。我们需要读取完整的HTML内容，然后解析这个字段。

代码示例（Obsidian插件环境） #

// 监听全局粘贴事件
document.addEventListener('paste', async (e) => {
  const clipboardItems = e.clipboardData?.items;
  if (!clipboardItems) return;

  for (const item of clipboardItems) {
    if (item.type !== 'text/html') continue;

    const htmlFile = item.getAsFile();
    if (!htmlFile) continue;

    // 获取完整的CF_Html格式内容
    const fullHtmlContent = await htmlFile.text();

    // 匹配SourceURL字段
    const sourceUrlMatch = fullHtmlContent.match(/SourceURL:\s*(.*?)\s*\n/i);
    if (!sourceUrlMatch?.[1]) {
      // 没有找到源URL，直接使用默认粘贴行为
      return;
    }

    const sourceUrl = sourceUrlMatch[1].trim();
    // 提取实际的内容片段（去掉CF_Html头部和尾部的包装）
    const startFragmentMarker = '<!--StartFragment-->';
    const endFragmentMarker = '<!--EndFragment-->';
    const startPos = fullHtmlContent.indexOf(startFragmentMarker) + startFragmentMarker.length;
    const endPos = fullHtmlContent.indexOf(endFragmentMarker);
    const contentFragment = fullHtmlContent.slice(startPos, endPos).trim();

    // 阻止默认粘贴，自定义插入内容+源URL
    e.preventDefault();
    const activeEditor = app.workspace.activeLeaf?.view?.editor;
    if (activeEditor) {
      const finalContent = `${contentFragment}\n\n来源: [${sourceUrl}](${sourceUrl})`;
      activeEditor.replaceSelection(finalContent);
    }
    break;
  }
});

注意事项 #

• 不是所有网站复制内容时都会写入SourceURL字段，只有Chrome、Edge等主流浏览器在复制网页内容时会添加，部分网站可能会移除这个信息
• 如果剪贴板中没有SourceURL，代码会自动回退到默认粘贴行为

替代方案（Workaround） #

如果无法从剪贴板获取到源URL，可以考虑以下两种方式：

1. 内部复制监听：在Obsidian内部监听复制事件，记录当前打开的笔记链接，粘贴时附加该链接——但只适用于Obsidian内部复制的场景
2. 手动补充弹窗：当检测不到源URL时，弹出输入框让用户手动填写来源链接，提升功能的兼容性

内容的提问来源于stack exchange，提问作者Genei180