Mã hóa/Giải mã HTML Entities
Công cụ mã hóa và giải mã HTML entities online miễn phí. Chuyển đổi ký tự đặc biệt sang HTML entities (<, >, &, ") hoặc giải mã entities về văn bản. Hỗ trợ named, numeric và hexadecimal entities. Hoàn hảo cho lập trình viên web, ngăn chặn tấn công XSS và hiển thị mã HTML an toàn.
Mã hóa/Giải mã HTML Entities - Chuyển đổi ký tự đặc biệt HTML
Công cụ mã hóa và giải mã HTML entities online toàn diện để chuyển đổi ký tự đặc biệt sang HTML entities và ngược lại. Hỗ trợ named entities (&, <, >), numeric entities (&, <) và hexadecimal entities (&, <). Thiết yếu cho lập trình viên web để ngăn chặn tấn công XSS, hiển thị mã HTML an toàn và xử lý ký tự đặc biệt trong ứng dụng web.
HTML entities là gì?
HTML entities là các mã đặc biệt được sử dụng để hiển thị các ký tự dành riêng hoặc đặc biệt trong HTML. Chúng bắt đầu bằng & và kết thúc bằng ; để phân biệt chúng với văn bản thông thường.
Tại sao HTML entities tồn tại:
- Một số ký tự có ý nghĩa đặc biệt trong HTML (<, >, &, ")
- Những ký tự này sẽ được hiểu là mã HTML, không hiển thị dưới dạng văn bản
- Entities cho phép bạn hiển thị các ký tự này một cách an toàn
- Cho phép hiển thị các ký tự không có trên bàn phím
- Hỗ trợ ký tự quốc tế và ký hiệu
Ba loại HTML entities:
1. Named Entities (phổ biến nhất):
< → <
> → >
& → &
" → "
' hoặc ' → '
→ khoảng trắng không ngắt
© → ©
® → ®
2. Numeric Entities (thập phân):
< → <
> → >
& → &
© → ©
3. Hexadecimal Entities:
< → <
> → >
& → &
© → ©
Cả ba định dạng hoạt động giống nhau - chúng cho trình duyệt biết hiển thị ký tự, không hiểu nó là mã.
Làm thế nào để mã hóa văn bản sang HTML entities?
Mã hóa văn bản sang HTML entities rất đơn giản:
1. Chọn chế độ 'Mã hóa' (mặc định)
2. Nhập hoặc dán văn bản của bạn vào trường nhập
3. Chọn loại mã hóa của bạn:
- Named: Sử dụng tên dễ đọc như < và & (khuyến nghị)
- Numeric: Sử dụng mã thập phân như < và &
- Hexadecimal: Sử dụng mã hex như < và &
4. Tùy chọn chọn 'Mã hóa tất cả ký tự đặc biệt' để mã hóa nhiều hơn chỉ <>&"'
5. Nhấp vào nút 'Mã hóa'
6. Văn bản đã mã hóa HTML-entity của bạn xuất hiện trong kết quả
Ví dụ 1 - Mã hóa cơ bản (named entities):
Đầu vào: "<div>Xin chào & tạm biệt</div>"
Đầu ra: "<div>Xin chào & tạm biệt</div>"
Ví dụ 2 - Numeric entities:
Đầu vào: "<p>Giá: $100 & lên</p>"
Đầu ra: "<p>Giá: $100 & lên</p>"
Ví dụ 3 - Với tùy chọn 'encode all':
Đầu vào: "© 2024 Công ty™"
Đầu ra (named): "© 2024 Công ty™"
Đầu ra (numeric): "© 2024 Công ty™"
Văn bản đã mã hóa có thể được hiển thị an toàn trong HTML mà không bị hiểu là mã.
Làm thế nào để giải mã HTML entities?
Giải mã HTML entities về văn bản bình thường rất đơn giản:
1. Chọn chế độ 'Giải mã'
2. Dán HTML có entities của bạn vào trường nhập
3. Nhấp vào nút 'Giải mã'
4. Văn bản đã giải mã, dễ đọc xuất hiện trong kết quả
Ví dụ 1 - Named entities:
Đầu vào: "<div>Xin chào & tạm biệt</div>"
Đầu ra: "<div>Xin chào & tạm biệt</div>"
Ví dụ 2 - Numeric entities:
Đầu vào: "<p>Giá: $100 & lên</p>"
Đầu ra: "<p>Giá: $100 & lên</p>"
Ví dụ 3 - Hex entities:
Đầu vào: "<span>Test</span>"
Đầu ra: "<span>Test</span>"
Ví dụ 4 - Mixed entities:
Đầu vào: "© 2024 – Bản quyền ™"
Đầu ra: "© 2024 – Bản quyền ™"
Công cụ tự động:
- Nhận diện cả ba loại entity (named, numeric, hex)
- Giải mã chúng chính xác về ký tự gốc
- Xử lý các định dạng entity lồng nhau hoặc hỗn hợp
- Đếm số lượng entities được tìm thấy
- Bảo toàn văn bản không phải entity không thay đổi
Khi nào nên sử dụng HTML entities?
HTML entities rất quan trọng trong nhiều tình huống:
1. Hiển thị mã HTML:
- Trang web hướng dẫn hiển thị ví dụ HTML
- Tài liệu mã nguồn
- Tô sáng cú pháp
- Bài viết blog về phát triển web
Ví dụ: Hiển thị "<div>" dưới dạng <div> để nó xuất hiện dưới dạng văn bản
2. Ngăn chặn tấn công XSS:
- Nội dung do người dùng tạo (bình luận, bài viết)
- Gửi form hiển thị trên trang
- Làm sạch đầu vào người dùng
- Nội dung cơ sở dữ liệu hiển thị trong HTML
Ví dụ: Chuyển <script> thành <script> để ngăn thực thi
3. Hiển thị ký tự đặc biệt:
- Ký hiệu bản quyền: ©
- Thương hiệu: ™
- Đã đăng ký: ®
- Tiền tệ: € £ ¥
- Ký hiệu toán học: × ÷ ±
4. Dấu ngoặc kép trong thuộc tính HTML:
- <div title="Anh ấy nói "Xin chào"">...</div>
- Ngăn phá vỡ thuộc tính HTML
- Thiết yếu cho data attributes có dấu ngoặc kép
5. Khoảng trắng không ngắt:
- ngăn ngắt dòng
- Hữu ích cho định dạng
- Giữ các từ với nhau
6. Ký tự có dấu (cũ):
- é → é
- ñ → ñ
- Lưu ý: Mã hóa UTF-8 hiện đại được ưu tiên hơn bây giờ
7. Khi KHÔNG nên sử dụng entities:
- HTML UTF-8 hiện đại (sử dụng ký tự thực: é, ñ, ©)
- Dữ liệu JSON (sử dụng UTF-8)
- Lưu trữ cơ sở dữ liệu (lưu ký tự thực)
- Email văn bản thuần
Thực hành tốt nhất:
- Luôn mã hóa đầu vào người dùng trước khi hiển thị trong HTML
- Sử dụng named entities để dễ đọc (© vs ©)
- Sử dụng charset UTF-8 và tránh entities cho ký tự quốc tế
- Mã hóa tối thiểu <>&"' để ngăn XSS
Sự khác biệt giữa named, numeric và hex entities là gì?
HTML entities có ba định dạng, tất cả đều tạo ra kết quả giống nhau:
1. Named Entities:
Định dạng: &name;
Ví dụ: < > & ©
Ưu điểm:
- Dễ đọc và ghi nhớ
- Tự mô tả (© rõ ràng là bản quyền)
- Dễ gõ và nhận diện hơn
- Tên chuẩn trên tất cả trình duyệt
Nhược điểm:
- Tập hợp giới hạn (chỉ ~250 named entities)
- Không phải tất cả ký tự đều có tên
- Dài hơn numeric cho một số ký tự
Sử dụng cho: Các ký tự phổ biến với tên nổi tiếng
2. Numeric Entities (Thập phân):
Định dạng: &#number;
Ví dụ: < > & ©  
Ưu điểm:
- Hoạt động cho BẤT KỲ ký tự Unicode nào (0-1,114,111)
- Không cần ghi nhớ (chỉ cần dùng mã ký tự)
- Hỗ trợ phổ quát
- Gọn cho ký tự số thấp
Nhược điểm:
- Không dễ đọc cho người (™ là gì?)
- Khó gỡ lỗi hoặc chỉnh sửa thủ công
- Lớn hơn cho giá trị Unicode cao
Sử dụng cho: Ký tự không có named entities
3. Hexadecimal Entities:
Định dạng: &#xHEX;
Ví dụ: < > & ©  
Ưu điểm:
- Hoạt động cho BẤT KỲ ký tự Unicode nào
- Khớp với tiêu chuẩn Unicode (U+00A9)
- Ngắn hơn cho giá trị Unicode cao
- Dễ tham chiếu chéo với bảng Unicode
Nhược điểm:
- Không dễ đọc cho người
- Yêu cầu kiến thức hex
- Ít phổ biến hơn thập phân
Sử dụng cho: Khi làm việc với tham chiếu Unicode
Bảng so sánh:
| Ký tự | Named | Thập phân | Hex |
|-------|----------|-----------|----------|
| < | < | < | < |
| > | > | > | > |
| & | & | & | & |
| " | " | " | " |
| © | © | © | © |
| € | € | € | €|
Khuyến nghị:
- Sử dụng named entities cho ký tự phổ biến (<, &, ©)
- Sử dụng numeric/hex cho ký tự hiếm hoặc khi biết mã ký tự
- Công cụ này mặc định là named entities để dễ đọc nhất
HTML entities ngăn chặn tấn công XSS như thế nào?
HTML entities rất quan trọng để ngăn chặn các cuộc tấn công Cross-Site Scripting (XSS):
XSS là gì?
- Kẻ tấn công chèn JavaScript độc hại vào trang web của bạn
- Nếu đầu vào người dùng được hiển thị mà không mã hóa, script có thể thực thi
- Có thể đánh cắp cookie, session token hoặc dữ liệu nhạy cảm
- Có thể làm hỏng trang web của bạn hoặc chuyển hướng người dùng
Cách entities ngăn XSS:
1. Vô hiệu hóa mã độc:
Đầu vào độc: <script>alert('XSS')</script>
Mã hóa an toàn: <script>alert('XSS')</script>
Kết quả: Hiển thị dưới dạng văn bản, không thực thi
2. Phá vỡ chèn HTML:
Tấn công: <img src=x onerror="alert('XSS')">
Mã hóa: <img src=x onerror="alert('XSS')">
Kết quả: Hiển thị dưới dạng văn bản, thẻ img không được tạo
3. Ngăn chèn thuộc tính:
Tấn công: " onclick="alert('XSS')"
Trong thuộc tính: <div title="đầu vào người dùng ở đây">
Không mã hóa: <div title="" onclick="alert('XSS')"">
Có mã hóa: <div title="" onclick="alert('XSS')"">
Kết quả: An toàn - được coi là một phần của văn bản title
Các ký tự thiết yếu cần mã hóa:
- < → < (ngăn tạo thẻ)
- > → > (ngăn đóng thẻ)
- & → & (ngăn chèn entity)
- " → " (ngăn phá vỡ thuộc tính)
- ' → ' (ngăn phá vỡ thuộc tính)
Thực hành tốt nhất:
1. Luôn mã hóa đầu vào người dùng trước khi hiển thị
2. Mã hóa khi xuất, không khi lưu trữ
3. Sử dụng thư viện mã hóa đáng tin cậy
4. Đừng cố lọc hoặc làm sạch - mã hóa mọi thứ
5. Kết hợp với Content Security Policy (CSP)
6. Không bao giờ tin tưởng đầu vào người dùng
Ví dụ mã dễ bị tấn công:
Sai: <div><?= $userInput ?></div>
Đúng: <div><?= htmlspecialchars($userInput) ?></div>
Mã hóa HTML entity là tuyến phòng thủ đầu tiên chống lại tấn công XSS!
Dữ liệu của tôi có an toàn khi sử dụng công cụ này không?
Có, dữ liệu của bạn hoàn toàn an toàn và riêng tư:
Tính năng riêng tư:
- Xử lý 100% phía client: Tất cả mã hóa/giải mã diễn ra trong trình duyệt của bạn
- Không tải lên máy chủ: Dữ liệu của bạn không bao giờ rời khỏi máy tính của bạn
- Không lưu trữ: Chúng tôi không lưu trữ, ghi nhật ký hoặc lưu bất kỳ dữ liệu nào bạn nhập
- Không theo dõi: Chúng tôi không theo dõi những gì bạn mã hóa hoặc giải mã
- Hoạt động offline: Sau khi tải, hoạt động mà không cần kết nối internet
- Mã nguồn mở: Mã trong suốt và có thể xác minh
Bạn có thể xác minh:
- Mở DevTools trình duyệt → tab Network (không có yêu cầu nào được gửi)
- Ngắt kết nối internet sau khi tải (vẫn hoạt động)
- Xem xét mã nguồn trang
Lời nhắc bảo mật:
- Công cụ này giúp bạn mã hóa/giải mã cho mục đích hiển thị
- Luôn mã hóa đầu vào người dùng phía server
- Đừng chỉ dựa vào mã hóa phía client cho bảo mật
- Sử dụng làm sạch và xác thực phía server thích hợp
- Kết hợp với các biện pháp bảo mật khác (CSP, HTTPS, v.v.)
Bản thân công cụ an toàn, nhưng hãy nhớ:
- Mã hóa để hiển thị, không chỉ để bảo mật
- Luôn xác thực và làm sạch trên server
- Sử dụng các thực hành bảo mật toàn diện
Tham khảo HTML entities phổ biến?
Đây là tham khảo nhanh các HTML entities thường dùng:
Ký tự thiết yếu:
< → < (nhỏ hơn)
> → > (lớn hơn)
& → & (và)
" → " (dấu ngoặc kép)
' hoặc ' → ' (dấu nháy đơn)
Khoảng trắng:
→ khoảng trắng không ngắt
  → khoảng trắng en
  → khoảng trắng em
  → khoảng trắng mỏng
Bản quyền & Pháp lý:
© → © (bản quyền)
® → ® (đã đăng ký)
™ → ™ (thương hiệu)
Tiền tệ:
€ → € (euro)
£ → £ (bảng Anh)
¥ → ¥ (yên)
¢ → ¢ (xu)
Toán học:
× → × (nhân)
÷ → ÷ (chia)
± → ± (cộng trừ)
≠ → ≠ (không bằng)
≤ → ≤ (nhỏ hơn hoặc bằng)
≥ → ≥ (lớn hơn hoặc bằng)
∞ → ∞ (vô cùng)
∑ → ∑ (tổng)
√ → √ (căn bậc hai)
Mũi tên:
← → ← (mũi tên trái)
→ → → (mũi tên phải)
↑ → ↑ (mũi tên lên)
↓ → ↓ (mũi tên xuống)
Dấu câu:
– → – (gạch ngang en)
— → — (gạch ngang em)
‘ → ' (ngoặc đơn trái)
’ → ' (ngoặc đơn phải)
“ → " (ngoặc kép trái)
” → " (ngoặc kép phải)
… → … (ba chấm)
Chữ cái Hy Lạp:
α → α
β → β
γ → γ
δ → δ
π → π
ω → ω
Lưu ý: Với mã hóa UTF-8 hiện đại, bạn thường có thể sử dụng ký tự thực (©, €, ñ) thay vì entities, nhưng entities vẫn thiết yếu cho <, >, &, " và ' để ngăn vấn đề phân tích HTML.
Tính năng chính
- Mã hóa văn bản sang HTML entities (named, numeric hoặc hexadecimal)
- Giải mã HTML entities về ký tự gốc
- Hỗ trợ named entities (&, <, ©, v.v.)
- Hỗ trợ numeric entities (&, <, ©)
- Hỗ trợ hexadecimal entities (&, <, ©)
- Tùy chọn mã hóa chỉ ký tự thiết yếu hoặc tất cả ký tự đặc biệt
- Tự động đếm entities và thống kê
- Ngăn chặn tấn công XSS bằng cách mã hóa ký tự nguy hiểm
- Đảo ngược giữa chế độ mã hóa và giải mã bằng một cú nhấp chuột
- Thống kê so sánh kích thước theo thời gian thực
- Sao chép văn bản đã mã hóa/giải mã vào clipboard
- Tải xuống kết quả dưới dạng file văn bản
- Tải lên file văn bản để mã hóa/giải mã
- Hỗ trợ chế độ tối
- Xử lý 100% phía client - dữ liệu của bạn không bao giờ rời khỏi trình duyệt
- Không giới hạn kích thước file
- Hoạt động offline sau khi tải lần đầu
- Thiết kế responsive thân thiện với mobile
- Hỗ trợ Unicode và ký tự quốc tế
- Không cần đăng ký hoặc đăng nhập