HTML Escape / Unescape

HTML एस्केपिंग क्या है?

HTML एस्केपिंग वह प्रक्रिया है जिसमें HTML में विशेष अर्थ रखने वाले characters को उनके entity references से बदला जाता है। पाँच characters जिन्हें अनिवार्य रूप से escape किया जाना चाहिए वे हैं: ampersand (&), less-than (<), greater-than (>), double quote ("), और single quote ('). एस्केपिंग के बिना browser इन characters को displayable text के बजाय markup instructions के रूप में interpret करता है, जिससे page rendering टूट जाती है और injection attacks का रास्ता खुलता है।

HTML विनिर्देश (WHATWG द्वारा maintained) वर्ण संदर्भों के दो रूप परिभाषित करता है: &amp; जैसी नामांकित एंटिटी और &#38; या &#x26; जैसी संख्यात्मक एंटिटी। नामांकित एंटिटी स्रोत कोड में पढ़ने में सरल होती हैं। संख्यात्मक एंटिटी (दशमलव या hexadecimal) किसी भी Unicode कोड पॉइंट को represent कर सकती हैं, जो उन वर्णों के लिए उपयोगी है जिनका कोई नामांकित उपनाम नहीं है। दोनों रूप ब्राउज़र में समान आउटपुट उत्पन्न करते हैं।

अनएस्केपिंग (जिसे डीकोडिंग भी कहते हैं) विपरीत क्रिया है: एंटिटी संदर्भों को उनके मूल वर्णों में पुनः परिवर्तित करना। यह तब सामान्य है जब HTML स्रोत से पाठ निकाला जा रहा हो, सामग्री को प्रणालियों के बीच स्थानांतरित किया जा रहा हो, या उन टेम्पलेटों की जाँच की जा रही हो जो एंटिटी को दोहरी बार एन्कोड करते हैं। यह टूल दोनों दिशाओं को ब्राउज़र में संभालता है, इसलिए आप कुछ ही सेकंड में अपनी एस्केपिंग तर्क की जाँच कर सकते हैं या HTML-युक्त स्रोत से सादा पाठ प्राप्त कर सकते हैं।

HTML Escape टूल का उपयोग क्यों करें?

बड़े पाठ खंडों में ऐंगल ब्रैकेट और ऐम्परसेंड को manually बदलना थकाऊ और त्रुटिपूर्ण है। एक समर्पित टूल बिना किसी इंस्टॉलेशन के एक चरण में आपके इनपुट को कनवर्ट करता है।

HTML Escape के उपयोग के मामले

HTML एंटिटी संदर्भ तालिका

नीचे दी गई तालिका सामान्यतः उपयोग की जाने वाली HTML एंटिटी सूचीबद्ध करती है। पाँच विशेष वर्णों (& < > " ') को HTML सामग्री और एट्रिब्यूट मानों में सदा एस्केप किया जाना चाहिए। अन्य एंटिटी वैकल्पिक हैं परंतु उन वर्णों के लिए उपयोगी हैं जो टाइप करने में कठिन या स्रोत कोड में अस्पष्ट हैं।

एस्केपिंग बनाम अनएस्केपिंग: किसका उपयोग कब करें

दोनों क्रियाएँ एक-दूसरे की विपरीत हैं। गलत दिशा चुनने से दोहरी-एन्कोडेड या असुरक्षित आउटपुट उत्पन्न होता है।

कोड उदाहरण

नीचे चार भाषाओं में HTML एस्केपिंग और अनएस्केपिंग के कार्यशील उदाहरण दिए गए हैं। प्रत्येक खंड दोनों दिशाओं को संभालता है और नेस्टेड उद्धरण तथा संख्यात्मक एंटिटी जैसे सीमांत मामलों को दर्शाता है।

// Escape HTML entities manually
function escapeHtml(str) {
  return str
    .replace(/&/g, '&')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#39;')
}

escapeHtml('<img src="x" onerror="alert(1)">')
// → "&lt;img src=&quot;x&quot; onerror=&quot;alert(1)&quot;&gt;"

// Unescape using DOMParser (browser only)
function unescapeHtml(str) {
  const doc = new DOMParser().parseFromString(str, 'text/html')
  return doc.documentElement.textContent
}

unescapeHtml('&lt;div&gt;Hello&lt;/div&gt;')
// → "<div>Hello</div>"

import html

# Escape special characters
html.escape('<script>alert("XSS")</script>')
# → '&lt;script&gt;alert(&quot;XSS&quot;)&lt;/script&gt;'

# Escape including single quotes (quote=True is default in Python 3.8+)
html.escape("It's <b>bold</b>", quote=True)
# → 'It&#x27;s &lt;b&gt;bold&lt;/b&gt;'

# Unescape entities back to characters
html.unescape('&lt;p&gt;Price: &euro;10&lt;/p&gt;')
# → '<p>Price: €10</p>'

# Unescape numeric entities
html.unescape('&#60;div&#62;&#38;amp;&#60;/div&#62;')
# → '<div>&amp;</div>'

package main

import (
    "fmt"
    "html"
)

func main() {
    // Escape HTML special characters
    escaped := html.EscapeString(`<a href="page?id=1&sort=name">Link</a>`)
    fmt.Println(escaped)
    // → &lt;a href=&quot;page?id=1&amp;sort=name&quot;&gt;Link&lt;/a&gt;

    // Unescape back to original
    original := html.UnescapeString("&lt;b&gt;Go &amp; HTML&lt;/b&gt;")
    fmt.Println(original)
    // → <b>Go & HTML</b>
}

<?php
// Escape HTML entities (ENT_QUOTES escapes both " and ')
echo htmlspecialchars('<p class="info">Tom & Jerry's</p>', ENT_QUOTES, 'UTF-8');
// → &lt;p class=&quot;info&quot;&gt;Tom &amp; Jerry&#039;s&lt;/p&gt;

// Convert all applicable characters to HTML entities
echo htmlentities('Price: 10€ — 50% off', ENT_QUOTES, 'UTF-8');
// → Price: 10&euro; &mdash; 50% off

// Decode entities back
echo html_entity_decode('&lt;div&gt;&amp;copy; 2026&lt;/div&gt;');
// → <div>&copy; 2026</div>

अक्सर पूछे जाने वाले प्रश्न