文字列エスケープ/アンエスケープ
様々な形式の文字列の特殊文字をエスケープ・アンエスケープするツールです。データ処理、API開発、フロントエンド作業に必須です!
Examples:
サポート形式
📝 JSON
JSON形式用の特殊文字をエスケープします。
エスケープ:
- 改行 →
\n - タブ →
\t - 引用符 →
\" - バックスラッシュ →
\\
使用例:
- APIリクエスト/レスポンス
- 設定ファイル
- データ保存
🌐 HTML
XSS攻撃を 防ぐためにHTML特殊文字をエスケープします。
エスケープ:
<→<>→>&→&"→"'→'
使用例:
- ユーザー入力の表示
- XSS防止
- HTML生成
🔗 URL
URLで安全に送信するために特殊文字をエンコードします。
エスケープ:
- スペース →
%20 - 日本語/特殊文字 → パーセントエンコーディング
- 予約文字 → エンコード
使用例:
- クエリパラメータ
- URL生成
- APIエンドポイント呼び出し
💻 JavaScript
JavaScript文字列用の特殊文字をエスケープします。
エスケープ:
- 改行 →
\n - 引用符 →
\'または\" - バックスラッシュ →
\\ - Unicode →
\uXXXX
使用例:
- 動的スクリプト生成
- テンプレートリテラル処理
- コード生成
📄 XML
XML/HTML形式用の特殊文字をエスケープします。
エスケープ:
<→<>→>&→&"→"'→'
使用例:
- XMLドキュメント生成
- SOAP API
- RSS/Atomフィード
実践例
ユーザー入力の表示
// XSS防止
const userInput = '<script>alert("XSS")</script>';
const escaped = escapeHTML(userInput);
// 結果: <script>alert("XSS")</script>
document.getElementById('output').textContent = escaped;
APIリクエスト
// JSONエスケープ
const data = {
message: 'こんにちは\n世界\t!'
};
const jsonString = JSON.stringify(data);
// 結果: {"message":"こんにちは\\n世界\\t!"}
URLクエリパラメータ
// URLエンコーディング
const searchQuery = '検索テスト';
const encodedQuery = encodeURIComponent(searchQuery);
// 結果: %E6%A4%9C%E7%B4%A2%E3%83%86%E3%82%B9%E3%83%88
const url = `https://api.example.com/search?q=${encodedQuery}`;
動的コード生成
// JavaScriptエスケープ
const userMessage = "It's a \"great\" day!";
const code = `console.log('${userMessage.replace(/'/g, "\\'")}');`;
// 結果: console.log('It\'s a \"great\" day!');
使用のヒント
1. 形式の選択
- JSON: API通信やデータ保存用
- HTML: Webページでのコンテンツ表示用
- URL: クエリパラメータやパスセグメント用
- JavaScript: 動的なコード生成用
- XML: XMLドキュメントやRSSフィード用
2. エスケープが必要な場合
- ✅ ユーザー入力の表示
- ✅ APIデータ送信
- ✅ データベースクエリ生成
- ✅ URLパラメータ渡し
- ✅ 動的コード生成
3. アンエスケープが必要な場合
- ✅ 受信したAPIデータの処理
- ✅ クエリパラメータの解析
- ✅ 保存されたデータの復元
- ✅ URLエンコードされたデータの処理
セキュリティ考慮事項
XSS防止
ユーザー入力を表示する際は必ずエスケープ:
// ❌ 危険
element.innerHTML = userInput;
// ✅ 安全
element.textContent = userInput;
// または
element.innerHTML = escapeHTML(userInput);
SQLインジェクション防止
エスケープの代わりにパラメータ化クエリを使用:
// ❌ 危険
const query = `SELECT * FROM users WHERE name = '${userInput}'`;
// ✅ 安全
const query = 'SELECT * FROM users WHERE name = ?';
db.execute(query, [userInput]);
注意事項
- 形式によって異なるエスケープ方法が必要です
- エスケープ ≠ エンコーディング（異なる概念）
- サーバーサイドの検証も必要です
- 二重エスケープ/アンエスケープに注意
- 各言語の組み込み関数を使用してください
関連ツール
- JSON Formatter - JSONフォーマット
- URL Encoder - URLエンコーディング
- Base64 Encoder - Base64エンコーディング
- Text Diff - テキスト比較