That Time a Single & Broke Production

The 3-Hour Debugging Session From Hell

Let me tell you about the dumbest bug I've ever shipped.

2021. Production. API calls failing silently. The error? "Invalid request." Super helpful.

I checked the payload. Fine. Checked the headers. Fine. Checked auth. Fine. Rebuilt the request from scratch. Still broken.

Three hours later, I found it. One & character in a user-submitted search query. Unencoded. So instead of searching for "bread & butter", the server thought butter was a separate query parameter with no value.

One character. Three hours. I don't talk about this at job interviews.

URLs Are Picky Little Things

URLs can't just have any character in them. Spaces? Nope. Ampersands? Those mean "new parameter." Question marks? That starts the query string.

So when you need to include these characters as actual data (like in a search query), you have to encode them. A space becomes %20. An ampersand becomes %26. A question mark becomes %3F.

It's called percent-encoding because... they're percent signs. Creative naming.

Normal:  cats & dogs
Encoded: cats%20%26%20dogs

The browser/server sees %26 and thinks "oh, that's a literal ampersand, not a parameter separator."

When This Will Bite You

API calls with user input. If someone searches for "Tom & Jerry", you better encode that before sticking it in a URL.

Redirect URLs. Ever seen a redirect with a ?return_to= parameter? If that URL inside a URL isn't encoded, everything breaks.

Form data. When you POST a form with application/x-www-form-urlencoded, the browser encodes it. But if you're building requests manually, that's on you.

Sharing links. Someone sends you a Google Drive link with weird characters in the filename. If the share link isn't encoded properly, it won't work.

Stop Memorizing %XX Codes

I used to have a mental note that space is %20 and ampersand is %26. Then I needed to encode a # and had to look it up anyway.

Just use a tool. Paste text in, get encoded text out. Paste encoded text in, get normal text out.

URL Encoder/Decoder — paste, click, done. No signup, no tracking, runs in your browser.

Quick Debugging Tip

Getting unexpected 400 errors on API calls? Before you start console.logging everything:

1. Copy the full URL
2. Paste it into the decoder
3. Check if any parameters look broken

Half the time it's an encoding issue. The other half... well, good luck.

Characters That Need Encoding

The obvious ones:

• Space → %20 (or + in some contexts)
• & → %26
• ? → %3F
• = → %3D
• # → %23
• / → %2F (if it's data, not a path separator)

But honestly, just encode anything that isn't a regular letter, number, or -_.~. Safer that way.

Try the URL Encoder/Decoder