⚡ Curated dev resources & dealsSponsored
DevToolBayFree Developer Tools

URL 编码指南:%20、加号与保留字符

百分号编码标准、表单编码的历史遗产、组件与完整 URL 的区别。

发布于·约 2 分钟阅读

URL encoding bugs hide in plain sight: a plus sign that becomes a space, a slash that cuts a parameter short, a mailto link that breaks in exactly one mail client. The rules fit in one article — and a habit of checking.

What percent-encoding actually is

A URL can only carry a limited set of characters safely. Everything else — space, accents, Emoji, a literal slash inside a value — becomes %XX byte sequences. A space is %20; a plus sign in a query value is %2B, because in application/x-www-form-urlencoded space is written as a literal +.

encodeURI vs encodeURIComponent

  • encodeURI keeps URL structure (/ ? & #) — for encoding a complete address.
  • encodeURIComponent escapes structure too — for encoding a value that will live inside another URL.

Using the wrong one is the classic bug: full URLs pasted as parameter values without component encoding lose everything after the inner query. The URL Encoder & Decoder has both modes with the per-character mapping shown.

Double-encoding and its twin

Sent through two encoders, a value turns %20 into %2520. Decode repeatedly in the tool until changes stop — that reveals how many layers the data passed through, and which layer dropped it. Equally common: decoding once at a layer that should not decode at all.

Parsing beats guessing

When a URL misbehaves, inspect it structurally instead of staring at the string. The URL Parser splits protocol, host, path, each query key-value pair and the fragment, decoding each parameter individually per WHATWG rules — the same rules browsers apply, so what you see is what routing code gets.

相关指南

文中提到的工具