HTML/URL/JS文字列をエスケープ/アンエスケープする方法
ページやAPIを stray なクォート、アンパサンド、Unicode で壊さないために。HTML、URL、JavaScript、JSON、CSV、XMLの安全な形へ相互変換します。

なぜ重要か
顧客レビューをウェブバナー用JSON設定に貼ったとします。レビューに紛れた"でバンドラーはビルド成功、デプロイ後にトップページがUncaught SyntaxError。修正は単純—クォートをエスケープ—ですが、どのエスケープ(HTMLエンティティ?JSON \"?URL %22?)かが実務スキルです。このツールはそれらを1か所に集め、Stack Overflow の正規表現コピペをやめさせます。
実際の3つのシーン
<script>を<script>に変換し、ブラウザがリテラル表示するようにします。
XSSや描画破綿を防ぐ
name=O'Haraをname=O%27HaraへURLエンコードしてからURLへ付加します。
API呼び出しが通る
フィールドを引用で囲み、内側の引用は倍化—CSVプロファイルが自動処理します。
きれいなインポート
手順
エスケープツールを開きます。
生の入力を貼る
オリジナルは左ペイン、エスケープ結果は右ペインに表示されます。
宛先フォーマットを選ぶ
HTML、URL、JavaScript/JSON、CSV、XML。ルールはそれぞれ異なります。ソースではなく宛先に合わせて選びます。
Escape と Unescape を切り替える
すでにエスケープされた文字列から元へ戻すときはUnescape—たとえばJSONエンコードされたログ行をデバッグするときなど。
安全な文字列をコピーする
結果をコード、設定、API呼び出しへ貼ります。
生
<a href="x">Hi & welcome</a>HTMLエスケープ済み
<a href="x">Hi & welcome</a>生
She said "hi" on Tuesday — line break
follows.JSエスケープ済み
She said \"hi\"\ton Tuesday \u2014 line break\nfollows.
実践テクノ
- 必要なときだけエスケープ。 宛先がDOMノードの
textContentならブラウザが代行します。二重エスケープが最頻バグです。 - URLクエリは値ごとにエンコードします。URL全体を一度にエンコードすると正しい
=``&まで壊します。 - JSON ≠ JavaScript。 JSはシングルクォートが使える一方、JSONは使えません。宛先フォーマットに合うプロファイルを選んでください。
- 往復テスト: エスケープしてアンエスケープし、オリジナルと一致するか確認します。コントロール文字が混入していると一致しないので先に強めのクリーンが必要になることがあります。
よくある落とし穴
よくある誤り
二重エスケープ: 「&」になってほしいのに「&amp;」
すでにエスケープ済み入力にまたかけています。Unescapeで生形式か確認してから、宛先用に一度だけエスケープします。
よくある誤り
Unicodeがファイル上でリテラル`\u00XX`になる
下流ツール(古いPHPや一部SQLドライバ)が\uXXXXを解釈しません。URLプロファイル(UTF-8バイトのパーセントエンコード)を使うか、生UTF-8で保持し出力時のみエスケープします。
よくある誤り
CSVが引用フィールド内のタブまでエスケープするようだ
CSV規則は内側引用の倍化のみで、タブや改行はそのまま通ります。インポーターが列カウントでタブ/改行に弱い場合は区切りを;へ変えるか、全フィールドを引用で囲みます。
向いていない用途
- タグ許可リスト付きHTMLの無害化(ブログコメントなど)は DOMPurify のようなサニタイザが必要です。丸ごとエスケープでは足りません。
- SQLはドライバのパラメータバインドを使うべきで、文字列レベルのエスケープではありません。
- シェルの引数エスケープはシェル依存(
bash対cmd.exe)。言語標準のshlex等を使ってください。
FAQ
encodeURI と encodeURIComponent の違いは?
encodeURIは予約URL文字(:``/``?など)を残します。encodeURIComponent(ここのURLプロファイル既定)はそれらもエンコードするので、単一値向きであって全体URLには向きません。
絵文字は保持されますか?
はい。各プロファイルがマルチバイトUTF-8を適切に処理します(URLなら %F0%9F%98%80、JSならサロゲート \uD83D\uDE00 など)。
テキストはどこかに送信されますか?
いいえ。エスケープはローカルで完結し、結果はブラウザから出ません。
次のステップ
- エスケープ後、オリジナルとの比較で目視チェックします。
- 埋め込んだJSONをテキストフォーマッターで整形します。
- テキストではなくバイナリなら、Base64/Hexコーデックを使ってください。