浏览器书签同步-自用小思路

• floccus自己也在用, 但是需要打开支持插件的浏览器才能同步, Safari又装不了, 用的坚果云不到一个月流量就没了


• 天才程序员花了半天时间做了个自用的书签同步, 感觉很舒服呀


• 首先写了个Chrome浏览器插件, 监听书签的变动, 然后推送到远程接口


• 然后又写了个cloudflare-worker, 展示书签页面, 开放同步接口接收书签数据


• 很流畅, 基本2秒钟就能完成书签推送

// 请将此处的域名替换为你实际部署的 Cloudflare Worker 地址

// 注意路径必须以 /sync 结尾

const CF_WORKER_URL = "https://xxx.xxx.xxx/sync";



// 必须与 Cloudflare 环境变量中的 API_SECRET 保持完全一致

const API_SECRET = "xxx";



let syncTimeout = null;

const SYNC_DELAY_MS = 5000; // 防抖延迟: 书签操作停止 5 秒后执行同步



// 核心同步函数

async function syncBookmarksToCloudflare() {

  try {

    // 获取当前浏览器完整的书签树结构

    const bookmarkTreeNodes = await chrome.bookmarks.getTree();



    // 发起 POST 请求传输数据

    const response = await fetch(CF_WORKER_URL, {

      method: "POST",

      headers: {

        "Content-Type": "application/json",

        "Authorization": `Bearer ${API_SECRET}`

      },

      body: JSON.stringify(bookmarkTreeNodes)

    });



    if (response.ok) {

      const result = await response.json();

      console.log(`[${new Date().toLocaleTimeString()}] 书签同步成功. 服务器返回:`, result);

    } else {

      console.error(`[${new Date().toLocaleTimeString()}] 书签同步失败. HTTP 状态码:`, response.status);

    }

  } catch (error) {

    console.error(`[${new Date().toLocaleTimeString()}] 同步过程中发生网络或执行错误:`, error);

  }

}



// 防抖触发器: 避免在短时间内批量操作书签(如导入/整理)时发起大量网络请求

function scheduleSync() {

  if (syncTimeout) {

    clearTimeout(syncTimeout);

  }

  syncTimeout = setTimeout(syncBookmarksToCloudflare, SYNC_DELAY_MS);

}



// 监听浏览器书签的所有生命周期事件

chrome.bookmarks.onCreated.addListener(scheduleSync);

chrome.bookmarks.onRemoved.addListener(scheduleSync);

chrome.bookmarks.onChanged.addListener(scheduleSync);

chrome.bookmarks.onMoved.addListener(scheduleSync);

chrome.bookmarks.onChildrenReordered.addListener(scheduleSync);

chrome.bookmarks.onImportEnded.addListener(scheduleSync);





    

  

{

  "manifest_version": 3,

  "name": "Cloudflare Bookmark Sync",

  "version": "1.0",

  "description": "自动监听书签修改并同步至 Cloudflare 部署的书签管理页面",

  "icons": {

    "16": "icons/icon16.png",

    "48": "icons/icon48.png",

    "128": "icons/icon128.png"

  },

  "permissions": [

    "bookmarks"

  ],

  "host_permissions": [

    "https://xxx.xxx.xxx/*"

  ],

  "background": {

    "service_worker": "background.js"

  }

}





    

  

• cf代码有点多就不放了 ^-^