Encode or decode URLs and URL components for web development.
Plain Text
What is URL Encoding? URL encoding, also known as percent-encoding, is a mechanism for encoding information in a URL by replacing unsafe ASCII characters with a "%" followed by two hexadecimal digits representing the character's ASCII code.
URLs can only contain certain characters from the ASCII set. Characters outside this set, or characters that have special meaning in URLs, must be encoded to ensure proper transmission and interpretation by web browsers and servers.
Common Use Cases:
• Query parameters: Safely pass data in URL search strings
• Form data submission: Encode form fields in POST requests
• API parameters: Pass complex data to RESTful API endpoints
• File names in URLs: Handle files with special characters
• International characters: Support non-English text in URLs
• JavaScript URL manipulation: Build dynamic URLs programmatically
encodeURIComponent (Component Method):
• Encodes all characters except: A-Z a-z 0-9 - _ . ! ~ * ' ( )
• Use for: Query parameter values, form data, any text that will be part of a URL component
encodeURI (Full URI Method):
• Preserves URL structure characters: : / ? # [ ] @ ! $ & ' ( ) * + , ; =
• Use for: Complete URLs that might contain international characters but should keep their structure
Encoding Examples:
Original:
"Hello World!" user@example.com path/file name.txt
encodeURIComponent:
%22Hello%20World!%22%20user%40example.com%20path%2Ffile%20name.txt
encodeURI:
%22Hello%20World!%22%20user@example.com%20path/file%20name.txt
Characters That Need Encoding:
• Space: %20 (most common)
• Special characters: " % # & + = ? / \ : @ < > [ ] { } | ` ^ ~
• Non-ASCII characters: Unicode characters (accented letters, emoji, etc.)
• Control characters: Tab, newline, carriage return
Real-World Examples:
Search query with spaces:
"javascript tutorial" → "javascript%20tutorial"
Email in query parameter:
user@domain.com → user%40domain.com
File path with spaces:
/documents/my file.pdf → /documents/my%20file.pdf
Best Practices:
• Use encodeURIComponent for query parameter values
• Use encodeURI for complete URLs with special characters
• Always encode user input before adding to URLs
• Don't double-encode already encoded strings
• Remember to decode on the server side when processing
• Test with international characters and edge cases
📚 Learn More:
• Read our detailed URL Encoding Deep Dive
• Learn about HTTP Protocol Explained
• Try our Base64 Encoder for different encoding needs
Free online developer tools and utilities for encoding, formatting, generating, and analyzing data. No registration required - all tools work directly in your browser.
Built for developers, by developers. Privacy-focused and open source.
Free online tools for Base64 encoding, JSON formatting, URL encoding, hash generation, UUID creation, QR codes, JWT decoding, timestamp conversion, regex testing, and more.
© 2024 NarvikHub. All rights reserved.