Cách mã hóa và giải mã URL
Nếu bạn đã từng thấy %20 trong một URL nơi đáng lẽ có một khoảng trắng, hoặc %C3%A9 nơi đáng lẽ có một ký tự có dấu, bạn đã gặp phải mã hóa URL. Đó là một viên gạch nền tảng của web, và việc hiểu nó giúp gỡ lỗi các liên kết bị hỏng, các vấn đề API và việc gửi biểu mẫu.
Mã hóa URL làm gì
URL chỉ có thể chứa một bộ ký tự an toàn hạn chế: chữ cái (A-Z, a-z), chữ số (0-9) và một vài ký tự đặc biệt (-, _, ., ~). Tất cả những thứ khác — khoảng trắng, dấu, emoji, ký hiệu như &, =, #, ? — phải được chuyển sang định dạng an toàn.
Mã hóa URL (còn gọi là percent-encoding) thay thế các ký tự không an toàn bằng % theo sau là giá trị hex byte của chúng:
| Ký tự | Đã mã hóa |
|---|---|
| Khoảng trắng | %20 |
| & | %26 |
| = | %3D |
| # | %23 |
| ? | %3F |
| / | %2F |
| @ | %40 |
Khi nào cần mã hóa URL
- Tham số truy vấn với ký tự đặc biệt — một truy vấn như
price > 100 & category = shoescần mã hóa để hoạt động trong một URL - Ký tự không Latin trong URL — tên, thành phố hoặc nội dung bằng các ngôn ngữ khác phải được mã hóa
- Yêu cầu API — khi xây dựng các cuộc gọi API thủ công, các giá trị tham số thường cần mã hóa
- Gỡ lỗi — khi một URL không hoạt động, giải mã nó sẽ tiết lộ các giá trị thực
Cách mã hóa và giải mã
- Chọn mã hóa hoặc giải mã — chọn hướng. Sử dụng encodeURIComponent cho các tham số truy vấn hoặc encodeURI cho các URL đầy đủ.
- Dán đầu vào của bạn — nhập văn bản hoặc URL. Kết quả cập nhật ngay tức thì.
- Sao chép đầu ra — sử dụng kết quả trong mã của bạn, yêu cầu API hoặc trình duyệt.
Mẹo
- Mã hóa các giá trị, không phải toàn bộ URL — nếu bạn mã hóa toàn bộ URL, các dấu gạch chéo và dấu hai chấm cấu trúc URL cũng sẽ được mã hóa, làm hỏng nó. Chỉ mã hóa các giá trị bên trong tham số truy vấn.
- Mã hóa kép — mã hóa một chuỗi đã được mã hóa tạo ra những thứ như
%2520(%trở thành%25). Nếu URL của bạn có vẻ sai, hãy kiểm tra xem có gì đó được mã hóa hai lần không. - Giải mã để gỡ lỗi — khi một yêu cầu API thất bại hoặc một URL có vẻ không thể đọc được, hãy giải mã nó để xem các giá trị thực. Điều này thường tiết lộ vấn đề ngay lập tức.
- Sử dụng các hàm tích hợp của ngôn ngữ của bạn — trong mã sản xuất, luôn sử dụng
encodeURIComponent()(JavaScript),urllib.parse.quote()(Python) hoặcURLEncoder.encode()(Java) thay vì mã hóa thủ công.
Câu hỏi thường gặp
Sự khác biệt giữa encodeURI và encodeURIComponent là gì?
encodeURI bảo toàn các ký tự hợp lệ trong cấu trúc URL (dấu gạch chéo, dấu hai chấm, dấu hỏi). encodeURIComponent mã hóa mọi thứ ngoại trừ chữ cái, chữ số và một vài ký tự an toàn. Sử dụng encodeURIComponent cho các giá trị tham số truy vấn, encodeURI cho các URL đầy đủ.
Tại sao khoảng trắng trở thành %20 hoặc +?
Trong mã hóa URL, khoảng trắng trở thành %20. Trong dữ liệu biểu mẫu (application/x-www-form-urlencoded), khoảng trắng trở thành +. Cả hai đều hợp lệ trong ngữ cảnh của chúng, nhưng %20 là tiêu chuẩn phổ quát cho URL.
Tôi có cần mã hóa URL của mình thủ công không?
Trong hầu hết các trường hợp, ngôn ngữ hoặc framework của bạn xử lý mã hóa tự động. Mã hóa thủ công hữu ích khi bạn xây dựng URL bằng tay, gỡ lỗi các yêu cầu API hoặc làm việc với chuỗi truy vấn chứa các ký tự đặc biệt.
Dữ liệu của tôi có được gửi đến máy chủ không?
Không. Tất cả việc mã hóa và giải mã diễn ra trong trình duyệt của bạn.