Oh MyUtils

HTMLエンコーダー&デコーダー - HTMLエンティティエスケープ オンライン

特殊文字をHTMLエンティティにエンコード、HTMLエンティティをテキストにデコード。XSS脆弱性を防止 — 100%クライアント処理。

モード
エンティティ形式
エンコードモード
入力
出力

よくある質問

HTMLエンコーディングとは何ですか?

HTMLエンコーディング(HTMLエスケープ)は、<、>、&、"、'などの特殊文字をHTMLエンティティ(&lt;、&gt;、&amp;、&quot;、&#39;)に変換するプロセスです。ブラウザがこれらをHTMLマークアップとして解釈するのを防ぎます。

このツールの使い方は?

入力フィールドにテキストを入力または貼り付けてください。エンコードモードでテキストをHTMLエンティティに変換、デコードモードでエンティティをテキストに戻します。エンティティ形式とエンコードモードを選択できます。

データは安全ですか?

はい。すべての処理はブラウザ内で100%行われます。データはサーバーに送信されません。

HTMLエンコーディングはXSS攻撃をどう防ぎますか?

XSS攻撃はWebページに悪意のあるスクリプトを注入します。HTMLエンコーディングは<や>などの文字を無害なエンティティに変換し、ブラウザが実行する代わりにテキストとして表示するようにします。

名前、10進数、16進数エンティティの違いは?

名前エンティティは記述的な名前を使用します(&lt;)。10進数エンティティはUnicodeコードポイントを使用します(&#60;)。16進数エンティティは16進コードポイントを使用します(&#x3C;)。3つの形式はすべて有効なHTMLです。

コード例

// HTML Encode (minimal)
function encodeHtml(text) {
  const entities = { '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' };
  return text.replace(/[&<>"']/g, c => entities[c]);
}

// HTML Decode
function decodeHtml(encoded) {
  const textarea = document.createElement('textarea');
  textarea.innerHTML = encoded;
  return textarea.value;
}

console.log(encodeHtml('<script>alert("XSS")</script>'));
// &lt;script&gt;alert(&quot;XSS&quot;)&lt;/script&gt;

console.log(decodeHtml('&lt;div&gt;Hello &amp; World&lt;/div&gt;'));
// <div>Hello & World</div>

関連ツール