HTMLエンコード
ページ公開ではなく、貼り付けても壊れない文字列のためのHTMLエンコード
HTMLエンコードのページに来る人の多くは、「Webページを作る」より「次のシステムへ文字列を渡す」目的に近いです。CMSからコピーしたツールチップ本文、JSONフィールドへ入れた`<div>`断片、ログ1行に混ざった`<`と`&`——そのまま渡すと受け側がマークアップとして解釈してしまいます。HTMLエンコードは`<`、`>`、`&`、引用符を`<`や`&`の形に変え、コピーと転送の途中で壊れないようにします。 左に貼り付け、右で結果をすぐ確認できます。アップロード待ちも、アカウントもありません。出力が更新されたか迷うこともありません。 機能は意図的に絞っています。レイアウトツールやタグ自動修正はありません。代わりに、連携現場で本当に効く2つ——パイプラインがエスケープを重ねるときの**二重エンコード**、そして**エンコード前の原文HTMLをリアルタイムでプレビュー**して「今エンコードしている断片が合っているか」を目で確かめる機能——を入れています。
HTMLエンコードが変えるもの
エンコードは、HTMLで意味を持つ文字——`<`、`>`、`&`、引用符——をエンティティ参照へ置き換えます。見た目のバイト列は変わっても、文の意図は変わりません。JSON、XML、属性値、DBのテキスト列のように「まず文字列として保存する」場所へHTML断片を入れるとき、HTMLエンコーダーを使います。 順序も重要です。`&`を先に処理しないと、既存のエンティティを壊します。**1回**は多くのチケットやAPIが期待する水準です。**2回**は、受け側でもう一度エスケープされるとき——最終的な保存値を`&lt;`の形で先に合わせたい場合——に使います。
貼り付け内容にタグが見えるとき、右パネルで原文HTMLをサンドボックスiframeでプレビューできます。既定タブは**エンコードテキスト**なので、エンティティ結果を先に見られます。タグのない純テキストだけをエンコードする作業は、プレビューなしで結果だけ表示します——現場ではこちらの方が多いパターンです。
HTMLエンコードツールを開く1回・2回をその場で切り替え
貼り直さずに回数だけ変え、同じ原文で1回と2回の出力を比較できます。連携仕様が曖昧なときに便利です。
原文をプレビュー、結果をコピー
HTML断片のプレビューは元の入力に対して動きます。エスケープ後の文字列を「描画」しようとしません。
貼り付けが不安ならファイル読み込み
チャットやメールクライアントが文字を再エスケープすることがあります。`.txt`や`.html`を直接読み込むと、意図したバイトを保ちやすくなります。
汎用escape関数ではなく、このHTMLエンコーダーを使う理由
HTMLエンコード専用の作業画面——コードエディタのメニュー奥深くにある機能ではありません。
貼って渡すワークフロー向け
サポート、連携、コンテンツ運用は一日中文字列を運びます。このHTMLエンコーダーは入力と同時に出力を更新し、ソースがディスク上にあるときは`.txt`と`.html`を読み込め、エンコード結果をワンアクションでコピーまたはダウンロードできます。内部URLや顧客データが混ざるpasteを、サーバー往復させる必要はありません。 ローカル優先なので、引用符を1つ直し、エスケープ形の変化を見ながら、staging APIへ貼り、また試す——という反復も速いです。ツールは邪魔をしません。
HTMLコードのエンコード方法（実務3ステップ）
1）エスケープしたい内容を貼り付けまたは読み込み
左パネルにHTML断片、メールsnippet、`&`や`<`を含む文を入れます。`.txt`や`.html`として既にあるなら**ファイルから読み込む**を使います。全文書である必要はなく、渡す断片が分かっていれば部分タグでも構いません。
2）1回・2回を選び、エンコードテキストを確認
下流が二重エンコードしない限り**1回**から始めます。右パネルは既定で**エンコードテキスト**です。入力がマークアップで目視確認したいときだけ、短く**プレビュー**で原文HTMLを見て、エンコード文字列に戻ってコピーしてください。
3）コピーまたはダウンロード
エスケープ済み1行を対象フィールドへ貼るか、チケット添付用に`.txt`を保存します。共用PCでは**クリア**で内容を消してください。
HTMLエンコード FAQ
一度エンコードして、安心して貼り付ける
ブラウザ内ライブHTMLエンコード。必要なら2回パス、タグがあるときは原文プレビュー。
HTMLエンコード
- ブラウザローカルHTMLエンコーダー
- 1回・2回エンコード
- コピー前に原文HTMLをプレビュー
- エンコードテキストのコピーとtxt保存
ブラウザで動作します。アカウントは不要です。
エスケープの深さを当てずっぽうにしない
エンコード結果はライブ更新。入力にタグがあるときだけ原文をプレビューしてからコピー。