/markdown - Web ページから Markdown を抽出する

/markdown エンドポイントは、Web ページのコンテンツを取得し、Markdown 形式に変換します。URL と、抽出を調整する任意のパラメーターを指定できます。

このエンドポイントは、次の 2 通りの方法で使えます。

• REST API: Browser Rendering - Edit 権限を持つ カスタム API トークンを作成 します。
• Workers Bindings: Workers Bindings を使い、Cloudflare Worker から直接エンドポイントを呼び出します。API トークンは不要です。

詳細は Quick Actions: 始める前に を参照してください。

https://api.cloudflare.com/client/v4/accounts/<accountId>/browser-rendering/markdown

url または html のいずれかを指定してください。

• url (string)
• html (string)

• 下流処理（要約、差分、埋め込み）向けにコンテンツを正規化する
• 編集や保存のために記事やドキュメントを保存する
• スタイルやスクリプトを除き、読みやすい本文とリンクだけを残す

curl -X 'POST' 'https://api.cloudflare.com/client/v4/accounts/<accountId>/browser-rendering/markdown' \
  -H 'Content-Type: application/json' \
  -H 'Authorization: Bearer <apiToken>' \
  -d '{
    "url": "https://example.com"
  }'

{
	"success": true,
	"result": "# Example Domain\n\nThis domain is for use in illustrative examples in documents. You may use this domain in literature without prior coordination or asking for permission.\n\n[More information...](https://www.iana.org/domains/example)"
}

import Cloudflare from "cloudflare";

const client = new Cloudflare({
	apiToken: process.env["CLOUDFLARE_API_TOKEN"],
});

const markdown = await client.browserRendering.markdown.create({
	account_id: process.env["CLOUDFLARE_ACCOUNT_ID"],
	url: "https://developers.cloudflare.com/",
});

console.log(markdown);

interface Env {
	BROWSER: BrowserRun;
}

export default {
	async fetch(request, env): Promise<Response> {
		return await env.BROWSER.quickAction("markdown", {
			url: "https://example.com",
		});
	},
} satisfies ExportedHandler<Env>;

URL を指定してコンテンツを取得する代わりに、生の HTML を直接渡せます。

curl -X 'POST' 'https://api.cloudflare.com/client/v4/accounts/<accountId>/browser-rendering/markdown' \
  -H 'Content-Type: application/json' \
  -H 'Authorization: Bearer <apiToken>' \
  -d '{
    "html": "<div>Hello World</div>"
  }'

{
	"success": true,
	"result": "Hello World"
}

rejectRequestPattern パラメーターで、Markdown 抽出を絞り込めます。この例では、指定した正規表現（CSS ファイルなど）に一致するリクエストを除外します。

curl -X 'POST' 'https://api.cloudflare.com/client/v4/accounts/<accountId>/browser-rendering/markdown' \
  -H 'Content-Type: application/json' \
  -H 'Authorization: Bearer <apiToken>' \
  -d '{
    "url": "https://example.com",
    "rejectRequestPattern": ["/^.*\\.(css)/"]
  }'

{
	"success": true,
	"result": "# Example Domain\n\nThis domain is for use in illustrative examples in documents. You may use this domain in literature without prior coordination or asking for permission.\n\n[More information...](https://www.iana.org/domains/example)"
}

JavaScript が多いページや Single Page Application（SPA）では、デフォルトのページ読み込み動作だと、空または不完全な結果が返ることがあります。ブラウザーが、JavaScript によるコンテンツ描画が終わる前にページ読み込み完了とみなすためです。

いちばん簡単な対処は、gotoOptions.waitUntil パラメータを networkidle0 または networkidle2 に設定することです。

{
	"url": "https://example.com",
	"gotoOptions": {
		"waitUntil": "networkidle0"
	}
}

より速い応答が必要な場合、上級者はネットワーク活動がすべて止まるのを待つのではなく、waitForSelector で特定の要素を待てます。必要なコンテンツが読み込まれたことを示す CSS セレクターを把握している必要があります。詳細は Quick Actions のタイムアウト を参照してください。

JSON 本文のトップレベルパラメーターとして userAgent を渡すと、ページ単位で User-Agent を変更できます。対象サイトが User-Agent に応じて別のコンテンツを返す場合に便利です。

質問がある場合やエラーが発生した場合は、Browser Run の FAQ とトラブルシューティングガイド を参照してください。

• Workers AI の AI.toMarkdown() は、複数のドキュメント種別と要約に対応します。
• Markdown for Agents は、コンテンツネゴシエーションヘッダーを使い、Cloudflare ゾーン向けにリアルタイムでドキュメントを変換します。