mcpField
S
scrape-review-schema

scrape-review-schema

github.com/zytedataデータ・データベース11172 回インストール2 日前に更新
リポジトリ

scrape-review-schema について

提案されたスクレイピングスキーマと抽出値を確認するため、ブラウザー用のレビュー画面を生成するスキルです。レビュー担当者のフィードバックを収集し、呼び出し元に返します。

主な機能

  1. 01ページ分析とスキーマの読み込み
  2. 02rawまたはrendered HTMLの選択
  3. 03ブラウザーレビュー画面の生成
  4. 04レビュー担当者のフィードバック収集

活用シーン

  1. 01提案された項目と抽出値の確認
  2. 02保存済みページと照らした抽出結果の確認
  3. 03呼び出し元へのスキーマ修正意見の送信

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/zytedata/skills --skill scrape-review-schema

インストール後、Claude Code で/scrape-review-schemaを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

assets/
review.html
review.js
style.css
scripts/
feedback-server.py
tests/
test_feedback_server.py

詳細

ブラウザーで、提案されたスキーマと抽出された値をユーザーが確認できるレビューページを生成します。

${CLAUDE_SKILL_DIR}/../scrape/references/python-environments.md を読みます。

入力

生の引数文字列は $ARGUMENTS です。最大 5 個の位置引数に分割します。 1 番目、2 番目、4 番目は空白区切りのトークンです。3 番目と 5 番目は空白を含む場合がある JSON リテラルです。括弧を対応させて境界を判別してください(呼び出し元が引用符で囲んでいる場合は、外側の一重引用符または二重引用符を取り除きます)。

  1. spec_path:仕様フォルダーのパス。例:.scrape/books-toscrape
  2. work_path:作業ディレクトリのパス。例:.scrape/.work/books-toscrape
  3. schema:提案されたスキーマを含む JSON オブジェクトリテラル({ で始まり、対応する } で終わります)
  4. html_variant:使用する HTML — raw または rendered
  5. changes(任意):前回のラウンドからの変更内容を示す JSON 配列リテラル([ で始まり、対応する ] で終わります)。例:["全ページで価格を再分析しました","フィールド isbn を削除しました"]

スキーマ JSON は JSON Schema 形式です(詳細については ${CLAUDE_SKILL_DIR}/../scrape/references/extraction-spec.md を参照してください)。

{
  "type": "object",
  "properties": {
    "price": {
      "type": "string",
      "description": "Product price"
    }
  }
}

フィールドには、source アノテーションを付けることもできます。値は「requested」(ユーザーが要求したもの)または「discovered」(AI が見つけたもの)です。

処理

1. 分析データを読み込む

{spec_path}/pages/ にあるページのサブディレクトリを一覧表示します(各サブディレクトリがページです)。各ページについて、メタデータを {spec_path}/pages/{page_id}/meta.json から、分析データを {work_path}/analyze-page/{page_id}.{html_variant}.json から読み込みます。

2. 一時ディレクトリを作成する

scrape-review-XXXXXX という名前の一時ディレクトリを作成します(XXXXXX はランダムなサフィックスです)。作成されたパスを {review_dir} として記録し、以降の手順で使用します。

3. 静的アセットをコピーする

このスキルのディレクトリにバンドルされているアセットを一時ディレクトリにコピーします。

  • review.html
  • style.css
  • review.js

コピー元のパスには ${CLAUDE_SKILL_DIR}/assets/ を使用します。

4. 保存済み HTML ページをコピーする

{spec_path}/pages/ の各ページディレクトリについて、選択したバリアントの HTML を {review_dir}/pages/{page_id}.html にコピーします。

cp {spec_path}/pages/{page_id}/{html_variant}.html {review_dir}/pages/{page_id}.html

これによりディレクトリ構造が平坦化され、レビューページの iframe で使用できるようになります。

5. data.js を生成する

レビューページに必要なすべてのデータを含む {review_dir}/data.js を生成して書き込みます。 ポートにはリテラルのプレースホルダー AGENT_PORT_PLACEHOLDER を使用します。サーバーはバインド後にこれを置き換えます。changes(任意の 5 番目の引数)が渡された場合は、ページにエージェントが行った変更を表示できるよう REVIEW_CHANGES を含めます。

const AGENT_URL = "http://127.0.0.1:AGENT_PORT_PLACEHOLDER/feedback";
const REVIEW_CHANGES = ["Re-analyzed price across all pages", "Dropped field isbn"];
const REVIEW_DATA = {
  fields: [
    {
      name: "price",
      type: "str",
      description: "Product price",
      source: "requested",
      values: {
        "detail-1": {"value": "$29.99", "url": "https://..."},
        "detail-2": {"value": "$49.99", "url": "https://..."}
      }
    }
  ],
  pages: {
    "detail-1": {
      url: "https://...",
      html_file: "pages/detail-1.html"
    }
  }
};
6. ブラウザーで開いてフィードバックを待つ

以下のコマンドをそのまま実行し、ほかの操作をする前に終了するまで待ちます。

FEEDBACK_FILE="{review_dir}/feedback.txt"
uv run "${CLAUDE_SKILL_DIR}/scripts/feedback-server.py" "{review_dir}" "${FEEDBACK_FILE}"
cat "${FEEDBACK_FILE}"

このコマンドを実行する前に、ユーザーが必要に応じてページを再度開けるよう、メッセージで {review_dir} をユーザーに伝えてください。

スクリプトはレビューページをブラウザーで開き、ユーザーがフィードバックを送信するまで待機した後、自動的に終了します。あなたが行うのは、コマンドが終了するまで待ち、その後 ${FEEDBACK_FILE} からフィードバックを読み取ることだけです。

フィードバックのテキストを呼び出し元に返します。

コメント