ブックマークレットでChatGPTの会話を一括アーカイブする方法

このスクリプトは、ChatGPTの履歴ページ上で複数の会話をまとめてアーカイブするための JavaScriptブックマークレット です。ブラウザ上で直接実行され、ページ遷移や拡張機能を必要としません。

全体の概要

ブックマークレットを実行すると、現在のページ上にオーバーレイUIが表示されます。
そこには会話履歴の一覧がチェックボックス付きで並び、選択した会話を一括でアーカイブできます。
処理状況はコンソールとUI内のログ領域の両方に表示されます。

認証情報の取得

スクリプトは、ページ内に埋め込まれている client-bootstrap 要素から accessToken を取得します。
このトークンは、ChatGPTのバックエンドAPIに対して認証付きリクエストを送るために使用されます。
取得に失敗した場合は、ログを出力して処理を中断します。

アーカイブ処理の仕組み

archiveConversation 関数は、会話IDを受け取り、該当する会話をアーカイブするための PATCH リクエストを送信します。
レスポンスが正常で、success: true が返った場合のみ成功と判定されます。
各会話は順番に処理され、結果がログに記録されます。

会話履歴の収集

履歴サイドバー内のリンク要素をDOMから取得し、URLから会話IDを抽出します。
リンクに表示されているテキストは、そのまま会話タイトルとして使用されます。
これらの情報をもとに、UI上の一覧が生成されます。

オーバーレイUIの構成

オーバーレイUIは画面全体を覆う半透明の背景と、中央に表示されるパネルで構成されています。
パネル内には以下の要素があります。

• UIを閉じるためのボタン
• 会話タイトルとチェックボックスの一覧
• 選択した会話をアーカイブするボタン
• 処理状況を表示するログエリア

ボタンはページ側のCSSの影響を受けないよう、ブラウザ標準に近い見た目に強制的にスタイルが指定されています。

ログ表示とデバッグ

ログ出力用のユーティリティ関数が用意されており、
同じ内容が console.log とUI内のログ領域の両方に表示されます。
これにより、処理の進行状況やエラーを視覚的に確認できます。

終了処理

アーカイブ処理が完了すると、オーバーレイUIは自動的に削除されます。
また、途中で閉じるボタンを押した場合もUIのみが消え、ページ自体には影響を残しません。

このブックマークレットを使うことで、ChatGPTの会話管理をブラウザだけで効率的に行うことができます。

(async () => {
  /* =============================
   * Logging utility
   * ============================= */
  let logContainer = null;

  function log(...args) {
    console.log("[Archive Bookmarklet]", ...args);

    if (logContainer) {
      const line = document.createElement("div");
      line.innerText = args.map(String).join(" ");
      logContainer.appendChild(line);
      logContainer.scrollTop = logContainer.scrollHeight;
    }
  }

  log("start");

  /* =============================
   * Load accessToken
   * ============================= */
  const bootstrapEl = document.getElementById("client-bootstrap");
  if (!bootstrapEl) {
    log("client-bootstrap not found");
    return;
  }

  const accessToken =
    JSON.parse(bootstrapEl.innerHTML).session.accessToken;

  log("accessToken loaded");

  /* =============================
   * archiveConversation
   * ============================= */
  async function archiveConversation(conversationId) {
    log("archive start:", conversationId);

    const response = await fetch(
      "https://chatgpt.com/backend-api/conversation/" + conversationId,
      {
        headers: {
          authorization: "Bearer " + accessToken,
          "content-type": "application/json"
        },
        body: JSON.stringify({ is_archived: true }),
        method: "PATCH",
        mode: "cors",
        credentials: "include"
      }
    );

    if (!response.ok) {
      log("HTTP error:", response.status);
      return false;
    }

    const result = await response.json();
    log("result:", JSON.stringify(result));

    return result.success === true;
  }

  /* =============================
   * Collect history links
   * ============================= */
  const links = Array.from(
    document.querySelectorAll("#history > a")
  );

  log("links found:", links.length);

  const conversations = links
    .map((a) => {
      const match = a
        .getAttribute("href")
        ?.match(/^\/c\/(.+)$/);

      if (!match) return null;

      return {
        conversationId: match[1],
        title: a.innerText.trim()
      };
    })
    .filter(Boolean);

  log("conversations parsed:", conversations.length);

  /* =============================
   * Normalize button style
   * ============================= */
  function normalizeButtonStyle(btn) {
    btn.style.all = "revert";
    btn.style.font = "inherit";
    btn.style.padding = "6px 12px";
    btn.style.border = "1px solid #888";
    btn.style.borderRadius = "4px";
    btn.style.background = "#eee";
    btn.style.color = "#000";
    btn.style.cursor = "pointer";
  }

  /* =============================
   * Overlay UI
   * ============================= */
  const overlay = document.createElement("div");
  overlay.style.position = "fixed";
  overlay.style.inset = "0";
  overlay.style.background = "rgba(0,0,0,0.6)";
  overlay.style.zIndex = "99999";
  overlay.style.display = "flex";
  overlay.style.justifyContent = "center";
  overlay.style.alignItems = "center";

  const panel = document.createElement("div");
  panel.style.background = "#fff";
  panel.style.padding = "16px";
  panel.style.width = "640px";
  panel.style.maxHeight = "80%";
  panel.style.overflow = "auto";
  panel.style.borderRadius = "8px";
  panel.style.fontSize = "14px";
  panel.style.position = "relative";

  /* ---- Close button ---- */
  const closeButton = document.createElement("button");
  closeButton.innerText = "×";
  normalizeButtonStyle(closeButton);
  closeButton.style.position = "absolute";
  closeButton.style.top = "8px";
  closeButton.style.right = "8px";

  closeButton.onclick = () => {
    log("UI closed");
    overlay.remove();
  };

  panel.appendChild(closeButton);

  /* ---- Title ---- */
  const title = document.createElement("h2");
  title.innerText = "Archive Conversations";
  panel.appendChild(title);

  /* ---- Conversation list ---- */
  const list = document.createElement("div");

  conversations.forEach((c) => {
    const label = document.createElement("label");
    label.style.display = "block";
    label.style.marginBottom = "6px";

    const checkbox = document.createElement("input");
    checkbox.type = "checkbox";
    checkbox.dataset.conversationId = c.conversationId;

    label.appendChild(checkbox);
    label.appendChild(
      document.createTextNode(" " + c.title)
    );

    list.appendChild(label);
  });

  panel.appendChild(list);

  /* ---- Archive button ---- */
  const archiveButton = document.createElement("button");
  archiveButton.innerText = "Archive selected";
  normalizeButtonStyle(archiveButton);
  archiveButton.style.marginTop = "12px";

  archiveButton.onclick = async () => {
    if (archiveButton.disabled) return;

    // Disable archive button
    archiveButton.disabled = true;
    archiveButton.style.opacity = "0.6";
    archiveButton.style.cursor = "not-allowed";
    archiveButton.innerText = "Archiving...";

    // Disable all checkboxes
    const allCheckboxes = Array.from(
      panel.querySelectorAll("input[type=checkbox]")
    );
    allCheckboxes.forEach((cb) => {
      cb.disabled = true;
    });

    const checked = allCheckboxes.filter((cb) => cb.checked);
    log("selected:", checked.length);

    for (const cb of checked) {
      const id = cb.dataset.conversationId;
      const ok = await archiveConversation(id);
      log(id, "->", ok);
    }

    log("done");
    overlay.remove();
  };

  panel.appendChild(archiveButton);

  /* ---- Log output ---- */
  const logTitle = document.createElement("h3");
  logTitle.innerText = "Log";
  logTitle.style.marginTop = "16px";
  panel.appendChild(logTitle);

  logContainer = document.createElement("div");
  logContainer.style.background = "#f5f5f5";
  logContainer.style.padding = "8px";
  logContainer.style.height = "120px";
  logContainer.style.overflow = "auto";
  logContainer.style.fontFamily = "monospace";
  logContainer.style.fontSize = "12px";

  panel.appendChild(logContainer);

  overlay.appendChild(panel);
  document.body.appendChild(overlay);

  log("UI rendered");
})();