HTML Entity Encoder/Decoder

Tính năng nổi bật

Tại sao HTML Entity Encoding quan trọng cho web security?

HTML Entity Encoding là defense layer quan trọng chống XSS attacks. XSS xảy ra khi attacker inject malicious scripts vào web pages. Ví dụ: user input '<script>alert("hacked")</script>' nếu không được encode sẽ execute JavaScript. Khi encode, nó thành '&lt;script&gt;...' và hiển thị như text thay vì execute. OWASP (Open Web Application Security Project) recommend encoding tất cả user-generated content trước khi render trong HTML. Ngoài security, encoding còn cần thiết để: Hiển thị ký tự < > & " trong content mà không bị interpret như HTML. Hiển thị ký tự đặc biệt như © ™ € mà không phụ thuộc vào character encoding. Đảm bảo content hiển thị đúng trên mọi browsers và devices.

Lợi ích khi sử dụng

• •Bảo vệ website khỏi XSS attacks - security best practice
• •Hiển thị đúng ký tự đặc biệt trong HTML content
• •Đảm bảo compatibility across browsers và platforms
• •Debug HTML issues - decode entities để xem original text
• •Prepare content cho HTML emails
• •Handle user-generated content safely
• •Không cần nhớ entity codes - có bảng tham khảo
• •Xử lý offline - an toàn cho sensitive data

Hướng dẫn chi tiết cách sử dụng HTML Entity Encoder/Decoder

1. 1Chọn mode: 'Encode' để chuyển text sang entities, 'Decode' để chuyển entities sang text
2. 2Nhập text vào ô input - có thể paste từ bất kỳ nguồn nào
3. 3Với Encode: các ký tự đặc biệt (<, >, &, ", non-ASCII) sẽ được chuyển thành entities
4. 4Với Decode: các entities (&lt;, &#60;, &#x3C;) sẽ được chuyển thành ký tự gốc
5. 5Xem kết quả ở ô output
6. 6Sử dụng bảng entities phổ biến để insert nhanh các ký tự đặc biệt
7. 7Click 'Copy' để sao chép kết quả
8. 8Paste vào HTML code, email template, hoặc bất kỳ đâu cần

HTML Entities phổ biến và ý nghĩa

Reserved Characters (bắt buộc encode trong HTML): &lt; (<) - less than, &gt; (>) - greater than, &amp; (&) - ampersand, &quot; (") - double quote, &#39; (') - single quote. Whitespace: &nbsp; - non-breaking space, &ensp; - en space, &emsp; - em space. Symbols: &copy; (©) - copyright, &reg; (®) - registered, &trade; (™) - trademark, &euro; (€) - euro, &pound; (£) - pound. Arrows: &larr; (←), &rarr; (→), &uarr; (↑), &darr; (↓). Math: &plusmn; (±), &times; (×), &divide; (÷), &ne; (≠), &le; (≤), &ge; (≥).

Named Entities vs Numeric Entities - Khi nào dùng cái nào?

Named Entities: Dễ đọc và nhớ (&copy; rõ nghĩa hơn &#169;). Chỉ có cho một số ký tự phổ biến. Ví dụ: &lt; &gt; &amp; &nbsp; &copy;. Numeric Entities (Decimal): Hoạt động cho mọi Unicode characters. Format: &#[decimal]; Ví dụ: &#60; &#169; &#8364;. Numeric Entities (Hexadecimal): Tương tự decimal nhưng dùng hex. Format: &#x[hex]; Ví dụ: &#x3C; &#xA9; &#x20AC;. Recommendation: Dùng named entities cho readability khi có. Dùng numeric entities cho Unicode characters không có named entity. Hex entities phổ biến trong CSS và JavaScript.

XSS Prevention - Best Practices với HTML Encoding

Context-aware encoding: HTML context dùng HTML entities. JavaScript context dùng JS encoding. URL context dùng URL encoding. CSS context dùng CSS encoding. Encode on output, not input: Store original data, encode khi render. Cho phép flexibility và tránh double-encoding. Use framework functions: React auto-escapes JSX. Angular auto-escapes templates. Vue auto-escapes mustache syntax. Chỉ cần cẩn thận với dangerouslySetInnerHTML, v-html, [innerHTML]. Content Security Policy: Thêm CSP headers như defense-in-depth. Validate input: Encoding là output defense, vẫn cần validate input để reject obviously malicious data.

Câu hỏi thường gặp (FAQ)

Từ khóa liên quan