Last updated

URL Encoder — Examples

The URL Encoder converts text and special characters into URL-safe percent-encoded format. Here are practical examples for all common URL encoding scenarios.

Basic Encoding

// JavaScript — URL encode a string
const text = "Hello World! This has spaces & special chars: <test>";

// encodeURIComponent — encodes everything except letters, digits, - _ . ! ~ * ' ( )
const encoded = encodeURIComponent(text);
console.log(encoded);
// "Hello%20World!%20This%20has%20spaces%20%26%20special%20chars%3A%20%3Ctest%3E"

// encodeURI — encodes everything except URI structural characters
const uri = "https://example.com/search?q=hello world&lang=en";
const encodedUri = encodeURI(uri);
console.log(encodedUri);
// "https://example.com/search?q=hello%20world&lang=en"
# Python — URL encode a string
from urllib.parse import quote, quote_plus, urlencode

text = "Hello World! This has spaces & special chars: <test>"

# quote — encodes everything except letters, digits, and _ . - ~
encoded = quote(text)
print(encoded)
# "Hello%20World%21%20This%20has%20spaces%20%26%20special%20chars%3A%20%3Ctest%3E"

# quote_plus — like quote but encodes spaces as +
encoded_plus = quote_plus(text)
print(encoded_plus)
# "Hello+World%21+This+has+spaces+%26+special+chars%3A+%3Ctest%3E"

Encoding Query Parameters

// JavaScript — build a URL with encoded query parameters
function buildUrl(base, params) {
  const query = Object.entries(params)
    .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
    .join("&");
  return `${base}?${query}`;
}

const url = buildUrl("https://api.example.com/search", {
  q: "hello world & more",
  lang: "en",
  filter: "date:2024-01-01..2024-12-31",
  callback: "https://mysite.com/callback?id=123"
});

console.log(url);
// https://api.example.com/search?q=hello%20world%20%26%20more&lang=en&...
# Python — build a URL with encoded query parameters
from urllib.parse import urlencode, urlunparse

params = {
    "q": "hello world & more",
    "lang": "en",
    "filter": "date:2024-01-01..2024-12-31",
    "callback": "https://mysite.com/callback?id=123"
}

query_string = urlencode(params)
url = f"https://api.example.com/search?{query_string}"
print(url)

Decoding URL-Encoded Strings

// JavaScript — decode a URL-encoded string
const encoded = "Hello%20World%21%20This%20has%20spaces%20%26%20special%20chars";

const decoded = decodeURIComponent(encoded);
console.log(decoded);
// "Hello World! This has spaces & special chars"

// Decode a full URL
const encodedUrl = "https://example.com/search?q=hello%20world&lang=en";
const decodedUrl = decodeURI(encodedUrl);
console.log(decodedUrl);
// "https://example.com/search?q=hello world&lang=en"
# Python — decode a URL-encoded string
from urllib.parse import unquote, unquote_plus, parse_qs

encoded = "Hello%20World%21%20This%20has%20spaces%20%26%20special%20chars"
decoded = unquote(encoded)
print(decoded)
# "Hello World! This has spaces & special chars"

# Parse a query string
query = "q=hello+world&lang=en&tags=python%2Cweb"
params = parse_qs(query)
print(params)
# {'q': ['hello world'], 'lang': ['en'], 'tags': ['python,web']}

Common Characters and Their Encodings

Encoding International Characters

// JavaScript — encode international characters
const international = "日本語テスト";
const encoded = encodeURIComponent(international);
console.log(encoded);
// "%E6%97%A5%E6%9C%AC%E8%AA%9E%E3%83%86%E3%82%B9%E3%83%88"

// Decode back
console.log(decodeURIComponent(encoded));
// "日本語テスト"

// Arabic
const arabic = "مرحبا";
console.log(encodeURIComponent(arabic));
// "%D9%85%D8%B1%D8%AD%D8%A8%D8%A7"

Form Data Encoding

// JavaScript — encode form data (application/x-www-form-urlencoded)
function encodeFormData(data) {
  return Object.entries(data)
    .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
    .join("&");
}

const formData = {
  username: "john doe",
  email: "john@example.com",
  message: "Hello! How are you? I'm fine & well."
};

const encoded = encodeFormData(formData);
console.log(encoded);
// "username=john%20doe&email=john%40example.com&message=Hello!%20How%20are%20you%3F..."

Avoiding Double-Encoding

// JavaScript — check if a string is already encoded before encoding
function safeEncode(str) {
  try {
    // If decoding changes the string, it was encoded
    const decoded = decodeURIComponent(str);
    if (decoded !== str) {
      // Already encoded — return as-is
      return str;
    }
  } catch (e) {
    // Not valid encoded string — encode it
  }
  return encodeURIComponent(str);
}

console.log(safeEncode("hello world"));     // "hello%20world"
console.log(safeEncode("hello%20world"));   // "hello%20world" (not double-encoded)

OAuth and API Authentication

# Python — URL encode OAuth parameters
from urllib.parse import quote

def oauth_encode(value):
    """
    OAuth 1.0 requires percent-encoding with uppercase hex digits
    and encoding of all characters except unreserved characters.
    """
    return quote(str(value), safe="")

# OAuth signature base string requires encoded parameters
params = {
    "oauth_consumer_key": "xvz1evFS4wEEPTGEFPHBog",
    "oauth_nonce": "kYjzVBB8Y0ZFabxSWbWovY3uYSQ2pTgmZeNu2VS4cg",
    "oauth_timestamp": "1318622958",
    "status": "Hello Ladies + Gentlemen, a signed OAuth request!"
}

encoded_params = "&".join(
    f"{oauth_encode(k)}={oauth_encode(v)}"
    for k, v in sorted(params.items())
)
print(encoded_params)

URL encoding is essential for any web application that passes data in URLs. Always encode user input before including it in URLs to prevent broken requests, security vulnerabilities, and data corruption.

Frequently Asked Questions

Yes, our Url Encoder is completely free with no registration required. Use it unlimited times without any restrictions.

Yes, all processing happens locally in your browser. Your data never leaves your device and is not stored on our servers.

No installation needed. The tool works directly in your web browser on any device.

Enter your input, click the action button, and get instant results. Copy the output for use in your projects.