HTMLコンテンツ抽出

HTML内の画像、カテゴリ、タイトルなどのコンテンツをカスタムルールで抽出します。

HTMLコンテンツ抽出とは

デフォルトでは、クローラーはページのタイトルや本文テキストを自動的に抽出します。しかし、サイトによっては、特定の情報（アイキャッチ画像、カテゴリタグ、更新日時など）を抽出したい場合があります。

HTMLコンテンツ抽出機能を使うことで、CSSセレクタを指定して、これらの情報を柔軟に抽出できます。

抽出可能なフィールド

以下のフィールドに対して、カスタム抽出ルールを設定できます。

フィールド	説明
タイトル	ページタイトル
画像	検索結果のサムネイルとして表示する画像です
最終更新日	ページの更新日です
カテゴリタグ	ページからカテゴリタグを抽出できます。カテゴリの検索対象になります
チャンクテキスト	検索結果のサマリ表示や、RAGの検索において利用されます。
汎用文字列1	検索結果に表示するための文字列です。検索対象として指定することはできません
汎用文字列2	検索結果に表示するための文字列です。検索対象として指定することはできません
汎用文字列3	検索結果に表示するための文字列です。検索対象として指定することはできません

各フィールドの既定の挙動

抽出ルールを設定していない場合や、CSSセレクタに一致する要素が見つからなかった場合は、以下のように自動的な値で補われます。

フィールド	挙動
タイトル	`<title>` タグの内容です。それも取得できない場合はURL末尾のファイル名が使われます
画像	`og:image` のmetaタグです。それも無ければ設定なしになります
最終更新日	サーバーが返す`Last-Modified`ヘッダーの値です。前回クロール時からページの内容が変わっていなければ前回の値、変わっていれば現在時刻が使われます
チャンクテキスト	設定した要素のテキストが、本文の自動チャンク分割の代わりにそのまま使われます。要素が見つからない場合は自動分割にフォールバックします

最終更新日のCSSセレクタで抽出した文字列は、2024-01-01、2024/01/01、2024.01.01、2024年01月01日、2024-01-01 15:30:00、ISO 8601（RFC3339）形式など、決まった書式のみ日時として解釈されます。タイムゾーンの指定がない書式は、日本時間として扱われます。

各フィールドの抽出結果は、10,000文字を超える部分が切り捨てられます。

フィールド設定

各フィールドでは、以下の項目を設定します。

項目	説明
フィールド	抽出先のフィールドです（抽出可能なフィールドの表を参照）
CSSセレクタ	抽出元の要素を指定します。複数の要素に一致する場合でも、最初に一致した1つの要素のみが使われます（複数要素の内容が結合されることはありません）
区切り文字	CSSセレクタで抽出したテキストを分割する文字です（オプション）。カテゴリタグ・チャンクテキストの2つのフィールドでのみ設定できます

複数のフィールドを同時に設定できます。

一般的な使用例

ブログ記事のアイキャッチ画像を抽出

設定名: ブログ記事のアイキャッチ
優先度: 1
パス: /blog/**
フィールド設定:
  - フィールド: image
    CSSセレクタ: .post-thumbnail img

この設定により、.post-thumbnail 内の img タグの src 属性が、image フィールドに抽出されます。

カテゴリタグを抽出

サイトによっては、複数のタグを1つの要素の中にカンマ区切りなどでまとめて出力している場合があります。そのような要素をCSSセレクタで指定し、区切り文字で分割してタグの配列にします。

設定名: ブログカテゴリ
優先度: 1
パス: /blog/**
フィールド設定:
  - フィールド: category_tags
    CSSセレクタ: .post-categories
    区切り文字: ,

この設定は、以下のようなHTMLを想定しています。

<div class="post-categories">お知らせ,キャンペーン</div>

区切り文字 , で分割され、「お知らせ」「キャンペーン」の2つのタグとして抽出されます。区切り文字を指定しない場合は、要素のテキスト全体が1つのタグとして抽出されます。

更新日時を抽出

設定名: 記事更新日
優先度: 1
パス: /blog/**
フィールド設定:
  - フィールド: last_modified
    CSSセレクタ: .post-date time

著者名を抽出

設定名: 記事著者
優先度: 1
パス: /blog/**
フィールド設定:
  - フィールド: generic_string1
    CSSセレクタ: .post-author .name

CSSセレクタの指定方法

CSSセレクタは、HTML共通部分の除外と同様に、IDやクラス名、タグ名で指定できます。

セレクタの例

.article-image img         - クラス article-image 内の img タグ
#main-content h1          - ID main-content 内の h1 タグ
meta[property="og:image"] - property属性が og:image のmetaタグ

区切り文字について

区切り文字は、CSSセレクタで抽出した1つの要素のテキストを分割するためのものです（複数の要素の内容を結合するものではありません）。カテゴリタグ・チャンクテキストの2つのフィールドでのみ指定できます。

例

セレクタ .tags で以下の要素が抽出された場合：

<div class="tags">
  JavaScript,React,Node.js
</div>

区切り文字に , を指定すると、前後の空白が取り除かれたうえで JavaScript、React、Node.js の3つに分割されます。

設定名は必須です
フィールドは1つの設定につき1〜10個まで指定できます
パスは作成後に変更できません。変更する場合は、削除してから作り直してください

抽出設定の変更は、インデックス再構築では反映されません。反映されるのは、次回の定期クロール、または「すべてのページを再クロール」操作で対象ページが実際に再取得されたときです。

HTMLコンテンツ抽出