Mã hóa/Giải mã URL

Mã hóa/Giải mã URL - Encode và Decode URL Online

Công cụ mã hóa và giải mã URL online mạnh mẽ giúp bạn mã hóa văn bản để sử dụng an toàn trong URL hoặc giải mã chuỗi URL percent-encoded về văn bản gốc. Tự động xử lý ký tự đặc biệt, khoảng trắng, Unicode và nhiều tùy chọn mã hóa. Thiết yếu cho lập trình viên web làm việc với tham số query, API endpoints, dữ liệu form và thao tác URL.

Mã hóa URL là gì?

Mã hóa URL (còn gọi là percent-encoding) là phương pháp mã hóa các ký tự đặc biệt trong URL bằng cách sử dụng ký hiệu % theo sau là hai chữ số thập lục phân. Điều này cần thiết vì URL chỉ có thể chứa một tập hợp giới hạn các ký tự ASCII.

Tại sao cần mã hóa URL:
- URL chỉ có thể truyền an toàn một số ký tự ASCII nhất định (A-Z, a-z, 0-9 và một vài ký tự đặc biệt)
- Các ký tự đặc biệt như khoảng trắng, &, ?, =, #, / có ý nghĩa đặc biệt trong URL
- Các ký tự không phải ASCII (Unicode, emoji, chữ có dấu) cần được mã hóa
- Ngăn ngừa lỗi phân tích URL và hỏng dữ liệu

Mã hóa phổ biến:
- Khoảng trắng → %20 (hoặc + trong query string)
- & → %26
- = → %3D
- ? → %3F
- # → %23
- / → %2F
- @ → %40
- Unicode: é → %C3%A9

Mã hóa URL được chuẩn hóa trong RFC 3986 và rất quan trọng cho:
- Tham số query string
- Gửi dữ liệu form
- Yêu cầu API
- Tạo URL động
- URL công cụ tìm kiếm

Làm thế nào để mã hóa URL?

Mã hóa URL hoặc văn bản để sử dụng trong URL 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 hoặc URL của bạn vào trường nhập
3. Chọn tùy chọn mã hóa của bạn:
- 'Mã hóa khoảng trắng thành %20': Chuyển khoảng trắng thành %20 (khuyến nghị)
- 'Mã hóa ký tự đặc biệt': Mã hóa tất cả ký tự không an toàn (khuyến nghị)
4. Nhấp vào nút 'Mã hóa'
5. Văn bản đã mã hóa URL của bạn xuất hiện trong trường kết quả

Ví dụ 1 - Văn bản đơn giản:
Đầu vào: "Xin chào!"
Đầu ra: "Xin%20ch%C3%A0o%21"

Ví dụ 2 - URL với tham số:
Đầu vào: "https://example.com/search?q=xin chào&lang=vi"
Đầu ra: "https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dxin%20ch%C3%A0o%26lang%3Dvi"

Ví dụ 3 - Ký tự đặc biệt:
Đầu vào: "tên=Nguyễn Văn A & tuổi=30"
Đầu ra: "t%C3%AAn%3DNguy%E1%BB%85n%20V%C4%83n%20A%20%26%20tu%E1%BB%95i%3D30"

Lưu ý: Nếu bạn chỉ mã hóa giá trị tham số query (không phải toàn bộ URL), bạn thường chỉ cần mã hóa phần giá trị, không phải dấu phân cách = hoặc &.

Làm thế nào để giải mã URL?

Giải mã URL percent-encoded về văn bản dễ đọc rất đơn giản:

1. Chọn chế độ 'Giải mã'
2. Dán chuỗi URL đã mã hóa 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 - Văn bản đã mã hóa:
Đầu vào: "Xin%20ch%C3%A0o%21"
Đầu ra: "Xin chào!"

Ví dụ 2 - Tham số query:
Đầu vào: "q%3Dxin%20ch%C3%A0o%26lang%3Dvi"
Đầu ra: "q=xin chào&lang=vi"

Ví dụ 3 - URL đầy đủ:
Đầu vào: "https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dxin%20ch%C3%A0o"
Đầu ra: "https://example.com/search?q=xin chào"

Công cụ tự động:
- Xử lý cả %20 và + như ký tự khoảng trắng
- Giải mã tất cả ký tự percent-encoded
- Hỗ trợ Unicode và ký tự quốc tế
- Hiển thị thông báo lỗi rõ ràng cho mã hóa không hợp lệ
- Bảo toàn cấu trúc và định dạng URL

Sự khác biệt giữa encodeURI và encodeURIComponent là gì?

Công cụ này sử dụng logic encodeURIComponent, đây là tùy chọn phổ biến và an toàn nhất. Đây là sự khác biệt:

encodeURIComponent (Được công cụ này sử dụng):
- Mã hóa TÂT CẢ ký tự đặc biệt ngoại trừ: A-Z a-z 0-9 - _ . ! ~ * ' ( )
- Mã hóa: / ? : @ & = + $ # , và khoảng trắng
- Sử dụng cho: Giá trị tham số query, dữ liệu form, đoạn path
- Ví dụ: "xin chào" → "xin%20ch%C3%A0o"
- Ví dụ: "a&b=c" → "a%26b%3Dc"

encodeURI (Không được sử dụng ở đây):
- Mã hóa ít ký tự hơn
- KHÔNG mã hóa: : / ? # [ ] @ ! $ & ' ( ) * + , ; =
- Sử dụng cho: Mã hóa URL hoàn chỉnh trong khi bảo toàn cấu trúc URL
- Ví dụ: "https://example.com/path?q=xin chào" → "https://example.com/path?q=xin%20ch%C3%A0o"

Khi nào sử dụng cái nào:

Sử dụng encodeURIComponent (công cụ này) cho:
- Giá trị tham số query riêng lẻ
- Dữ liệu trường form
- Bất kỳ đầu vào người dùng nào đi vào URL
- Tham số yêu cầu API
- Truy vấn tìm kiếm

Sử dụng encodeURI cho:
- URL hoàn chỉnh chỉ cần mã hóa khoảng trắng và Unicode
- Khi bạn muốn bảo toàn cấu trúc URL (://?&#)

Hầu hết phát triển web sử dụng encodeURIComponent để an toàn, đó là những gì công cụ này cung cấp.

Tại sao khoảng trắng được mã hóa thành %20?

Khoảng trắng được mã hóa thành %20 (hoặc đôi khi +) trong URL vì:

1. Đặc tả URL:
- RFC 3986 định nghĩa các ký tự URL hợp lệ
- Khoảng trắng không phải là ký tự hợp lệ trong URL
- Phải được percent-encoded để truyền an toàn

2. Hai phương pháp mã hóa cho khoảng trắng:

%20 (Percent encoding):
- Mã hóa URL tiêu chuẩn
- Hoạt động ở mọi nơi trong URL
- Được sử dụng trong đoạn path và query string hiện đại
- Rõ ràng và an toàn hơn
- Ví dụ: /path%20to/file

+ (Dấu cộng):
- Mã hóa cũ chỉ cho query string
- Định dạng application/x-www-form-urlencoded
- Phổ biến trong HTML form
- Không hợp lệ trong path URL
- Ví dụ: ?search=xin+chao

3. Tại sao %20 được ưu tiên:
- Hoạt động trong tất cả các phần của URL (path, query, fragment)
- Không mơ hồ (+ có thể là dấu cộng thực)
- Tiêu chuẩn hiện đại
- Nhất quán hơn

Ví dụ:
Đường dẫn URL: /documents/my%20file.pdf ✓
Đường dẫn URL: /documents/my+file.pdf ✗ (+ không được giải mã trong path)

Query string: ?q=xin%20chao ✓
Query string: ?q=xin+chao ✓ (nhưng mơ hồ)

Công cụ này sử dụng %20 theo mặc định để tương thích tối đa, nhưng có thể giải mã cả %20 và + khi giải mã.

Những ký tự nào cần được mã hóa URL?

Các ký tự cần mã hóa URL chia thành nhiều loại:

1. Ký tự dành riêng (có ý nghĩa đặc biệt trong URL):
: / ? # [ ] @ ! $ & ' ( ) * + , ; =
Những ký tự này PHẢI được mã hóa khi sử dụng như dữ liệu (không phải như dấu phân cách)

2. Ký tự không an toàn:
Khoảng trắng → %20
" → %22
< → %3C
> → %3E
% → %25 (phải luôn được mã hóa)
{ → %7B
} → %7D
| → %7C
\ → %5C
^ → %5E
~ → %7E
[ → %5B
] → %5D
` → %60

3. Ký tự không phải ASCII:
Tất cả ký tự ngoài ASCII cơ bản (mã 0-127)
Ví dụ:
- Có dấu: é → %C3%A9, ñ → %C3%B1
- Tiếng Việt: ă → %C4%83, ơ → %C6%A1
- Tiếng Trung: 你好 → %E4%BD%A0%E5%A5%BD
- Emoji: 😀 → %F0%9F%98%80

4. Ký tự điều khiển:
Ký tự 0-31 và 127 (không thể in)
Nên luôn được mã hóa

5. Ký tự an toàn (không bao giờ cần mã hóa):
A-Z a-z 0-9 - _ . ~ (ký tự không dành riêng)

Ví dụ thực tế:

Gốc: "search=xin chào&lang=vi"
Đã mã hóa: "search%3Dxin%20ch%C3%A0o%26lang%3Dvi"

Gốc: "[email protected]"
Đã mã hóa: "user%40example.com"

Gốc: "100% chính xác!"
Đã mã hóa: "100%25%20ch%C3%ADnh%20x%C3%A1c%21"

Khi nghi ngờ, hãy mã hóa nó! Mã hóa quá mức an toàn hơn mã hóa không đủ.

Sự khác biệt giữa mã hóa URL và mã hóa HTML là gì?

Mã hóa URL và mã hóa HTML phục vụ các mục đích khác nhau và sử dụng các định dạng khác nhau:

Mã hóa URL (Percent-Encoding):
- Định dạng: %XX (phần trăm + 2 chữ số hex)
- Mục đích: Làm cho văn bản an toàn cho URL
- Ví dụ: "xin chào" → "xin%20ch%C3%A0o"
- Ví dụ: "&" → "%26"
- Sử dụng trong: URL, query string, tham số API
- Tiêu chuẩn: RFC 3986

Mã hóa HTML (HTML Entities):
- Định dạng: &name; hoặc &#number;
- Mục đích: Hiển thị ký tự đặc biệt trong HTML
- Ví dụ: "xin chào" → "xin chào" (không thay đổi)
- Ví dụ: "&" → "&amp;" hoặc "&#38;"
- Ví dụ: "<" → "&lt;" hoặc "&#60;"
- Sử dụng trong: Nội dung HTML, thuộc tính
- Tiêu chuẩn: Đặc tả HTML

Sự khác biệt chính:

1. Khi nào sử dụng:
- Mã hóa URL: Đưa dữ liệu vào URL
- Mã hóa HTML: Hiển thị văn bản trong trang web

2. Những gì chúng mã hóa:
- Mã hóa URL: Khoảng trắng, ký tự đặc biệt, không phải ASCII
- Mã hóa HTML: <, >, &, ", và dấu ngoặc kép

3. Định dạng:
- URL: %20, %26, %3D
- HTML: &nbsp;, &amp;, &quot;

4. Ngữ cảnh:
- URL: Thanh địa chỉ, cuộc gọi API, liên kết
- HTML: Nội dung trang, ngăn chặn tấn công XSS

Ví dụ cho thấy cả hai:
Gốc: "Tìm kiếm: <xin & tạm biệt>"
Mã hóa URL: "T%C3%ACm%20ki%E1%BA%BFm%3A%20%3Cxin%20%26%20t%E1%BA%A1m%20bi%E1%BB%87t%3E"
Mã hóa HTML: "Tìm kiếm: &lt;xin &amp; tạm biệt&gt;"

Đừng nhầm lẫn chúng! Sử dụng sai loại mã hóa có thể gây ra:
- URL hoặc liên kết bị hỏng
- Vấn đề hiển thị trong trang web
- Lỗ hổng bảo mật (XSS)
- Hỏng dữ liệu

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ưu ý bảo mật:
- Mã hóa URL KHÔNG phải là mã hóa bảo mật
- URL đã mã hóa có thể dễ dàng được giải mã bởi bất kỳ ai
- Đừng dựa vào mã hóa URL để bảo vệ dữ liệu nhạy cảm
- Mật khẩu, API key, token nên sử dụng bảo mật thích hợp (HTTPS, encryption)

Mã hóa URL dành cho:
- Tương thích định dạng dữ liệu ✓
- Ngăn ngừa lỗi phân tích ✓
- Truyền URL an toàn ✓

KHÔNG dành cho:
- Ẩn thông tin nhạy cảm ✗
- Bảo mật hoặc bảo vệ ✗
- Mã hóa bảo mật ✗

Công cụ an toàn để sử dụng, nhưng hãy nhớ rằng dữ liệu mã hóa URL không phải là dữ liệu an toàn.

Các trường hợp sử dụng mã hóa URL phổ biến?

Mã hóa URL rất quan trọng trong nhiều tình huống phát triển web:

1. Tham số Query String:
- Truy vấn tìm kiếm: ?q=xin%20chao
- Giá trị bộ lọc: ?category=sach%20%26%20bao
- Phân trang: ?page=1&sort=ten%20tang
- Nhiều giá trị: ?tags=javascript%2Cnode.js

2. Yêu cầu API:
- Tham số GET: /api/users?email=user%40example.com
- Endpoint tìm kiếm: /search?term=cach%20lap%20trinh
- Tham số lọc: /products?name=Ao%20thun%20%28Xanh%29

3. Gửi Form:
- Dữ liệu POST trong application/x-www-form-urlencoded
- Trường form ẩn với ký tự đặc biệt
- Đường dẫn tải lên file có khoảng trắng

4. Tạo URL Động:
- Xây dựng URL trong JavaScript
- Tạo liên kết có thể chia sẻ
- URL chia sẻ mạng xã hội
- Liên kết email với nội dung điền sẵn

5. OAuth và Xác thực:
- URL chuyển hướng: redirect_uri=https%3A%2F%2Fexample.com
- Tham số state với dữ liệu JSON
- Giá trị token trong URL

6. Phân tích và Theo dõi:
- Tham số UTM: utm_source=email%20campaign
- Tên sự kiện tùy chỉnh
- Định danh người dùng

7. Quốc tế hóa:
- URL với ký tự không phải tiếng Anh
- Tiếng Việt: Xin chào → Xin%20ch%C3%A0o
- Tiếng Trung, Ả Rập, văn bản Cyrillic
- Emoji trong URL

8. Đường dẫn và Tên File:
- Khoảng trắng trong tên file: my%20document.pdf
- Ký tự đặc biệt trong đường dẫn
- URL lưu trữ đám mây

9. Liên kết Email:
- Liên kết mailto: với chủ đề/nội dung
- Nội dung email điền sẵn
- Ký tự đặc biệt trong địa chỉ

10. Gỡ lỗi:
- Kiểm tra phản hồi API
- Hiểu chuyển hướng
- Phân tích nhật ký máy chủ
- Kiểm tra xử lý URL

Ví dụ thực tế:
```
Xây dựng URL tìm kiếm:
Cơ sở: https://example.com/search
Truy vấn: "cà phê & trà"
Danh mục: "đồ uống/nóng"
Kết quả: https://example.com/search?q=c%C3%A0%20ph%C3%AA%20%26%20tr%C3%A0&cat=%C4%91%E1%BB%93%20u%E1%BB%91ng%2Fn%C3%B3ng
```

Tính năng chính

• Mã hóa văn bản sang định dạng URL-safe percent-encoded
• Giải mã URL percent-encoded về văn bản gốc
• Tự động xử lý ký tự đặc biệt (& = ? # / @ v.v.)
• Tùy chọn mã hóa khoảng trắng (%20 hoặc +)
• Hỗ trợ Unicode và ký tự quốc tế
• Xử lý emoji và ký tự đa byte
• Đả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
• Thông báo lỗi rõ ràng cho đầu vào không hợp lệ
• Không cần đăng ký hoặc đăng nhập