ForHosting KIT · 開発者向けツール

HTML整形ツール

HTML整形ツールは、圧縮、ミニファイ、または1行化されたマークアップを、要素の階層に従ってインデントされた読みやすい文書へ変換します。ページ全体、テンプレートの一部、生成済みレスポンスからコピーしたマークアップを貼り付けると、ネットワーク接続や非決定的な処理を使わず、2個の空白による安定した字下げを返します。コメント、宣言、引用符付き属性、scriptとstyleの生データ、自己終了構文、HTML標準の空要素に対応します。また、予期しない終了タグ、対応が誤ったタグ、閉じていない通常要素はエラーとして通知します。

● Beta無料・ブラウザ内で実行

無料で実行 API仕様を見る

ご利用方法ウェブAPIメールTelegramアプリ近日

ミニファイHTMLに隠れた階層を表示します

ミニファイはブラウザーへページを配信する際に役立ちますが、マークアップを理解するための視覚的な構造を失わせます。ナビゲーション、入れ子リスト、カード一覧、フォームなどが連続した1行になると、開始タグと終了タグの対応確認が難しくなります。本ツールは文書をソース順に走査し、現在のタグ階層から字下げを決めて構造を復元します。通常の開始要素ごとに深さを増やし、対応する終了要素で直前の深さへ戻します。テキストはコンテナーの深さに置き、コメントと宣言も論理的な位置に配置します。出力は常に2個の空白を使用するため、調査、文書化、コードレビュー、差分比較に適しています。要素の追加、属性の並べ替え、マークアップの再設計は行わず、入力にすでに存在する階層だけを明確で予測可能な形にします。

終了タグが不要なHTML構文を正しく扱います

山括弧で囲まれたすべてのトークンが階層を変えるわけではありません。img、input、meta、link、br、hrなどの標準空要素は終了タグがなくても完全なため、開始要素のスタックへ追加しません。明示的な自己終了構文も同様に処理します。コメント、文書型宣言、CDATAセクション、処理命令は1個の完全なトークンとして保持します。属性内の一重引用符と二重引用符を認識するため、値に含まれる大なり記号でタグが途中終了することもありません。script、style、textareaの内容は、対応する終了タグまで生テキストとして保持し、見かけ上の記号を子要素と誤認しません。同じ入力には常に同じ結果を返し、ネットワーク、時刻、乱数、DOMの自動修復、外部サービスには依存しません。

再利用前に不完全なタグ構造を検出します

整形対象のマークアップは、ログ、メールテンプレート、サーバーレスポンス、編集画面の項目、ビルド成果物などからコピーされることがあります。見た目が妥当でも、元データが途中で切れている場合があります。本ツールは開いている通常要素をスタックで管理し、逆順に閉じることを要求します。予期しない終了タグは直ちに失敗し、対応が違う場合は先に必要な終了タグを示します。入力末尾で通常要素が開いたままなら、その要素名を含む無効入力エラーを返します。標準空要素と明示的な自己終了タグは意図された例外です。この検査は構造に限定され、HTML標準の完全な適合性検証ではありません。レビュー、保存、文書化、後続処理の前にご利用ください。ブラウザーではローカル実行でき、自動化したAPIリクエストには公開基本料金$0.002が適用されます。

活用例

本番環境のミニファイ済みページを調査

1行のマークアップを展開し、コンポーネント、リンク、フォーム部品、埋め込みセクションを確認しやすくします。

テンプレートをレビュー用に準備

安定した字下げを適用し、入れ子タグを手作業で対応付けずに構造を比較できるようにします。

コピーしたHTML断片を確認

レスポンス、エディター、メッセージ、ログからコピーした後に、終了タグの欠落や対応ミスを検出します。

よくある質問

HTML整形ツールは何を変更しますか？

タグの入れ子に応じて改行と2個の空白による字下げを追加し、通常テキスト間の空白を正規化します。

終了タグなしで使えるタグはどれですか？

img、input、meta、link、br、hrなどの標準空要素には終了タグが不要です。明示的な自己終了構文にも対応します。

属性や埋め込みコードは保持されますか？

はい。属性と引用符付き値を維持し、script、style、textareaの内容は対応する終了タグまで生テキストとして扱います。

HTML標準を完全に検証できますか？

いいえ。タグの対応と一部の字句境界を検査しますが、文書構造、内容、アクセシビリティ、属性の全規則は検証しません。

APIリクエストの料金はいくらですか？

各リクエストには公開基本料金$0.002が適用されます。ブラウザー版はAPIを呼び出さずローカルで実行できます。

開発者向け — APIアクセス

このページの機能はすべてAPIからも利用できます。自社システムに組み込みたいチーム向けのセクションです。それ以外の方は上のツールをそのままお使いください。

エンドポイント

POSThttps://api.kit.forhosting.com/dev2/beautify-html

Bearerトークンで認証し、POST1回でタスクをキューに登録します。結果はWebhookまたは署名付きリンクで受け取れます。

お使いのスタックから呼び出す

curl -X POST https://api.kit.forhosting.com/dev2/beautify-html \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"html":"<!doctype html><html><body><main><h1>Hello</h1><p>Readable HTML.</p></main></body></html>"}'

const res = await fetch("https://api.kit.forhosting.com/dev2/beautify-html", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "html": "<!doctype html><html><body><main><h1>Hello</h1><p>Readable HTML.</p></main></body></html>"
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/dev2/beautify-html",
    headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
    json={
    "html": "<!doctype html><html><body><main><h1>Hello</h1><p>Readable HTML.</p></main></body></html>"
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/dev2/beautify-html", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => '{"html":"<!doctype html><html><body><main><h1>Hello</h1><p>Readable HTML.</p></main></body></html>"}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"html":"<!doctype html><html><body><main><h1>Hello</h1><p>Readable HTML.</p></main></body></html>"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/dev2/beautify-html", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

リクエスト例

{
  "html": "<!doctype html><html><body><main><h1>Hello</h1><p>Readable HTML.</p></main></body></html>"
}

レスポンス例

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "dev2.beautify_html",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

非同期APIです。task_idは即時に返ります。ポーリングは1秒あたり1リクエストまでです。

料金

1リクエストあたり$0.002

単価はすべて公開しています。トークン換算や独自クレジットはありません。失敗したタスクは課金されません。

エラー

HTTP	コード	意味
`401`	`unauthorized`	APIキーが無効か、指定されていません。Authorizationヘッダーを確認してください。
`402`	`insufficient_balance`	残高が不足しています。チャージ後に再度お試しください。
`404`	`unknown_type`	指定されたタスクタイプは存在しません。タイプ名を確認してください。
`429`	`rate_limited`	リクエストが多すぎます。しばらく待ってから再度お試しください。

KITの完全なドキュメントを見る →