Max Nardit
AI エージェント

Share2Agent で Web ページを Claude Code に送る方法

ドキュメント、エラーページ、記事を Claude Code のセッションに直接共有します。Share2Agent がページコンテンツを抽出し、軽量な Python レシーバーが Markdown として保存して、tmux 経由で Claude Code に通知します。

これは開発者にとって最も強力な Share2Agent インテグレーションです。ドキュメントや Stack Overflow の回答をコピペする代わりに、ワンクリックで共有して、コーディングセッション内ですぐに参照できます。


前提条件

  • Claude Codetmux セッション内で稼働している
  • Python 3.8+
  • Share2Agent Chrome 拡張機能がインストール済み

ステップ 1: receiver.py をダウンロードする

レシーバースクリプトは Share2Agent リポジトリに含まれています。

bash
git clone https://github.com/mnardit/share2agent.git
cd share2agent/examples/receiver

または、レシーバーだけをダウンロードします。

bash
curl -O https://raw.githubusercontent.com/mnardit/share2agent/main/examples/receiver/receiver.py

ステップ 2: 依存関係をインストールする

レシーバーには 1 つ依存関係があります。

bash
pip install pyyaml

ステップ 3: レシーバーを起動する

bash
python3 receiver.py

デフォルトではレシーバーは次のように動作します。

  • ポート 9876 で待ち受ける
  • ページを Markdown ファイルとして ./pages/ に保存する
  • 現在の tmux セッション に通知を送る

環境変数による設定

変数デフォルト説明
PORT9876HTTP サーバーのポート
PAGES_DIR./pagesMarkdown ファイルを保存するディレクトリ
TMUX_TARGET(現在のセッション)通知を送る tmux のターゲット (例: mysession:0)

カスタム設定の例:

bash
PORT=8080 PAGES_DIR=/home/user/shared-pages TMUX_TARGET=claude:0 python3 receiver.py

ステップ 4: Share2Agent を設定する

  1. Chrome で Share2Agent 拡張機能のアイコンをクリックします。
  2. Settings を開きます。
  3. Webhook URLhttp://localhost:9876 に設定します。
  4. 保存します。

レシーバーをリモートマシンで実行する場合は、サーバーのアドレスを使います (例: https://myserver.com:9876)。


ステップ 5: インテグレーションをテストする

  1. レシーバーが起動していて、Claude Code が tmux 内で動いていることを確認します。
  2. 任意の Web ページに移動します。たとえば Python のドキュメントページや GitHub Issue です。
  3. Share2Agent のアイコンをクリックして Share を押します。任意で「この API を説明して」のようなコメントを追加します。
  4. レシーバーがページを保存し、Claude Code に tmux 通知を送ります。

内部で何が起きているか

  1. Share2Agent がページコンテンツを抽出し、レシーバーに POST リクエストを送ります。
  2. レシーバーが YAML フロントマター付きの Markdown ファイルとしてコンテンツを保存します。
pages/2026-03-28-1430-python-asyncio-docs.md

ファイル名のフォーマットは YYYY-MM-DD-HHMM-slug.md で、slug はページタイトルから生成されます。

  1. 保存されたファイルの中身は次のようになります。
markdown
---
title: "Python asyncio documentation"
url: "https://docs.python.org/3/library/asyncio.html"
author: ""
language: "en"
saved_at: "2026-03-28T14:30:00.000Z"
comment: "explain this API"
---
 
The asyncio module provides infrastructure for writing
single-threaded concurrent code using coroutines...
  1. レシーバーが tmux 通知を送り、Claude Code がそれを受け取って新しいファイルを認識します。

ステップ 6: Claude Code で参照する

ページが保存されたら、Claude Code のセッションで参照できます。

pages/2026-03-28-1430-python-asyncio-docs.md を読んで主要な概念を説明してください。

または、現在のタスクのコンテキストとして pages ディレクトリ全体を Claude Code に指定します。


systemd による永続デプロイ

自動起動して再起動後も生き残るレシーバーを作るには、systemd サービスを作成します。

ini
# /etc/systemd/system/share2agent-receiver.service
[Unit]
Description=Share2Agent Receiver
After=network.target
 
[Service]
Type=simple
User=youruser
WorkingDirectory=/home/youruser/share2agent/examples/receiver
Environment=PORT=9876
Environment=PAGES_DIR=/home/youruser/shared-pages
Environment=TMUX_TARGET=claude:0
ExecStart=/usr/bin/python3 receiver.py
Restart=on-failure
RestartSec=5
 
[Install]
WantedBy=multi-user.target

有効化して起動します。

bash
sudo systemctl enable share2agent-receiver
sudo systemctl start share2agent-receiver

ヒント

  • リモートアクセスには HTTPS: インターネット経由でレシーバーにアクセスする場合は、TLS 対応のリバースプロキシ (Caddy、Nginx) の背後に配置します。
  • 複数のレシーバー: プロジェクトごとに別々のポートでレシーバーを動かし、それぞれ独自のディレクトリに保存します。
  • コメントでフィルタリング: receiver.py を改造して、comment フィールドに応じて異なるディレクトリにページを振り分けます。

次のステップ

  • プロジェクトのナレッジベースを構築: セッション開始時に関連ドキュメントをすべて共有しておけば、Claude Code は完全なコンテキストで作業できます。
  • エラーページを共有: 紛らわしいエラーに遭遇したら、Stack Overflow や GitHub Issue のページを「自分のプロジェクトでこのエラーが出る」のようなコメント付きで Claude Code に直接共有します。
  • ブックマークレットで自動化: Share2Agent をトリガーするブックマークレットを作って、さらに高速に共有します。