🐱We're live on Product Hunt today!Support our launch→
Toolhast

تشفير وفك تشفير روابط URL

شفر وفك تشفير الروابط والمتغيرات بنظام Percent-Encoding القياسي وفقاً لـ RFC 3986.

100% In-Browser Privacy:Zero network uploads. OAuth tokens, sensitive query params, and URLs never touch servers.
RFC 3986 Standard•Full UTF-8 Support
Mode:
85 chars
Percent-Encoded Output
Encoded or decoded result will appear here automatically...

The Developer's Guide to Percent-Encoding, RFC 3986 Standards, and URL Architecture

Uniform Resource Identifiers (URIs) and Uniform Resource Locators (URLs) are the universal addressing system of the internet. Defined by the Internet Engineering Task Force (IETF) in RFC 3986, a URL must adhere to a tightly constrained character set to ensure that web browsers, reverse proxies (Nginx, Cloudflare), web servers, and DNS routers parse addresses deterministically across every computing platform.

However, real-world web applications routinely transmit non-ASCII data, such as international alphabets, emojis, search terms containing ampersands (&), and nested callback links. Percent-encoding (often referred to as URL encoding) provides the standardized mechanism to represent arbitrary UTF-8 characters and reserved delimiters safely within URL query strings, path segments, and HTTP headers.

1. Anatomy of Percent-Encoding: The RFC 3986 Mechanism

Percent-encoding translates any character outside the permitted set into a three-character sequence: a literal percent sign (%) followed by two hexadecimal digits representing the byte's numerical value (from 00 to FF).

  • Single-Byte ASCII Characters: For standard US-ASCII characters, the hex value corresponds to its ASCII table index. For example, the space character has decimal ASCII value 32, which is hexadecimal 0x20, encoding into %20. Similarly, the question mark (?) has hex value 3F, encoding into %3F.
  • Multi-Byte UTF-8 Unicode: When encoding modern characters beyond basic Latin (such as accents, Arabic, Urdu, Chinese, or emojis), the character is first converted into its UTF-8 byte sequence, and each individual byte is percent-encoded. For example, the letter é consists of two UTF-8 bytes (0xC3 0xA9), encoding into %C3%A9. The rocket emoji (🚀) comprises four UTF-8 bytes (0xF0 0x9F 0x9A 0x80), producing %F0%9F%9A%80.

2. Reserved vs Unreserved Characters: The Core Rulebook

RFC 3986 divides all possible URL characters into two distinct categories:

Unreserved Characters (RFC 3986 §2.3)

Characters that never have syntactic delimiter roles: A–Z, a–z, 0–9, hyphen (-), underscore (_), period (.), and tilde (~). These characters must never be percent-encoded by standard encoders.

Reserved Characters (RFC 3986 §2.2)

Characters that serve as structural boundaries: : / ? # [ ] @ ! $ & ' ( ) * + , ; =. When used as literal user data rather than URL delimiters, they must be percent-encoded to prevent syntax ambiguity.

3. encodeURI() vs encodeURIComponent(): When to Use Each

A universal pitfall in frontend web development is using the wrong JavaScript encoding function. While their names appear similar, they serve entirely different architectural purposes:

FeatureencodeURI()encodeURIComponent()
Primary PurposeEncodes a complete, existing URL link.Encodes a single query parameter key or value.
Preserves URL DelimitersYes (leaves https://, /, ?, &, # unencoded)No (encodes / into %2F, & into %26, etc.)
Typical Use CaseFixing a broken full URL that contains raw spaces.Sanitizing user search terms, redirect URIs, or webhook payloads.

Rule of Thumb: If you are building a URL by concatenating query strings (e.g., "?search=" + val), you must always pass val through encodeURIComponent(). If you pass an entire URL into encodeURIComponent(), the browser will not recognize http%3A%2F%2F as a protocol.

4. The Space Encoding Dilemma: %20 vs Plus (+)

Engineers frequently wonder why some URLs encode spaces as %20 while others use +:

  • The RFC 3986 Standard (%20): In the official URI standard, the plus character (+) is a reserved sub-delimiter, not a space. Therefore, in URL path segments (e.g., /blog/my%20first%20post), a space must strictly be encoded as %20. Using + in a path segment represents a literal plus sign.
  • The HTML Form Standard (+): When HTML forms submit data via GET or POST using the media type application/x-www-form-urlencoded, spaces are converted into + characters for legacy readability (e.g., ?q=hello+world).

Toolhast provides a simple toggle allowing you to switch between standard %20 and form-encoded + based on your backend framework's expectations.

5. Security Considerations: Double Encoding and Injection Attacks

Improper handling of percent-encoding is a leading cause of severe web application security vulnerabilities:

  1. Double Encoding Attacks: If an application decodes an incoming URL parameter twice, an attacker can bypass security filters. For example, if a filter blocks <script>, the attacker can submit %253Cscript%253E. The first decode yields %3Cscript%3E (passing the filter), and the secondary decode executes the unescaped script tag.
  2. Open Redirect Vulnerabilities: OAuth2 and SSO workflows rely on redirect_uri parameters. If the redirect URL is unencoded or improperly validated, attackers can inject malicious destinations to steal authorization codes.
  3. Parameter Pollution: Failing to encode ampersands (&) inside parameter values allows attackers to inject unexpected query keys, altering application logic.

Zero-Upload Privacy: Toolhast executes all encoding, decoding, and URL inspection 100% locally inside your web browser. Sensitive API tokens, OAuth authorization codes, and internal query strings are never transmitted across the network or stored on external servers.

كيفية الاستخدام: تشفير وفك تشفير روابط URL

  1. Select your mode: URL Encoder & Decoder for bulk text conversion, or Query Parameter Inspector to parse full web links.

  2. Type or paste your raw text, query parameter, or full URL into the input editor, or click 'Sample' to load a demo.

  3. Choose your encoding scope (Component Mode for values vs Full URL Mode for links), and toggle space as '+' if needed.

  4. Click 'Copy' to copy the encoded or decoded output, or inspect and edit individual query parameters in the interactive builder.

أمثلة

المدخلات
Search Query Parameter: q=react & typescript tips? (with spaces & symbols)
المخرجات
q%3Dreact%20%26%20typescript%20tips%3F

Encoded via Component Mode, ensuring '&' and '?' do not break the surrounding URL query structure.

المدخلات
OAuth Callback Link: https://auth.example.com/login?redirect_uri=https://app.com/dashboard
المخرجات
https://auth.example.com/login?redirect_uri=https%3A%2F%2Fapp.com%2Fdashboard

The redirect parameter value is properly percent-encoded while preserving the outer authentication URL structure.

الأسئلة الشائعة

What is the difference between encodeURI and encodeURIComponent?

The `encodeURI` function encodes full web addresses while preserving structural URI delimiters like slashes, colons, question marks, and ampersands (`https://`, `?`, `&`). In contrast, `encodeURIComponent` aggressively encodes all characters except basic alphanumeric and unreserved symbols, making it mandatory for query parameter values so delimiters are not misinterpreted by web servers.

Should spaces be encoded as %20 or as a plus sign (+)?

Strict RFC 3986 URI standards require spaces to be percent-encoded as `%20`. However, the HTML form specification (`application/x-www-form-urlencoded`) standardizes encoding spaces as `+` inside URL query strings. For modern REST APIs and path segments, prefer `%20`; for legacy web form submissions and query parameters, `+` is widely accepted.

What characters are considered reserved in RFC 3986?

RFC 3986 designates characters with syntactic meaning as reserved: colons, slashes, question marks, hashes, brackets, and ampersands (`: / ? # [ ] @ ! $ & ' ( ) * + , ; =`). If these characters represent raw user data rather than URL structure, they must be percent-encoded to prevent breaking the URI parser.

What causes a URI malformed error during decoding?

A `URIError: URI malformed` occurs when a percent sign (`%`) is not followed by two valid hexadecimal digits (`0–9`, `A–F`), or when a multi-byte UTF-8 character sequence is truncated or invalid. Toolhast catches these exceptions automatically and alerts you to the exact malformed sequence so you can fix it.

What is double encoding and why is it dangerous?

Double encoding occurs when an already percent-encoded string is accidentally encoded a second time, turning `%20` into `%2520`. In web security, attackers use double encoding to bypass web application firewall (WAF) filters, potentially triggering directory traversal or cross-site scripting (XSS) if the backend server decodes the parameter twice unexpectedly.

Are my URLs, search queries, or API keys uploaded to any server?

No. Toolhast performs 100% of URL encoding, decoding, query parameter parsing, and link reconstruction directly inside your web browser via client-side JavaScript. No URL strings, search queries, OAuth authorization codes, bearer tokens, or tracking parameters are ever sent across the network or logged on external servers, guaranteeing total confidentiality.

  • مولد معرّفات UUID v4

    أنشئ معرّفات UUID و GUID عشوائية آمنة تشفيرياً وفق الإصدار 4 بشكل فردي أو جماعي.

  • منسق ومصحح JSON

    قم بتنسيق وتحسين وفحص نصوص JSON مع كشف أخطاء البنية وتصغير الحجم فورياً.

تصفح جميع أدوات المطورين

خاص: هذه الأداة تعمل في متصفحك. لا يتم تحميل أي بيانات تكتبها.

آخر تحديث