The practical answer
Start with a known sample such as A+B, a Chinese character and an emoji; write down what the receiving system expects. Decode one layer at a time, compare with the original, then encode back using the same convention. Treat images as bytes with a media type and text as characters with an encoding. Keep a Data URL prefix separate from the Base64 payload.
Plan the input and the review
- Start with a known sample such as A+B, a Chinese character and an emoji; write down what the receiving system expects.
- Decode one layer at a time, compare with the original, then encode back using the same convention.
- Treat images as bytes with a media type and text as characters with an encoding. Keep a Data URL prefix separate from the Base64 payload.
Choose the operation for this step
- Restore a Base64 image: Paste the full Data URL when available, inspect the decoded dimensions and download a copy before using it in a page.
- Encode or decode Base64 text: Use a known multilingual sample and compare the decoded text character by character; Base64 is reversible representation, not encryption.
- Inspect URL escaping: Choose a URL component deliberately. Decoding a whole URL may turn escaped separators into structure; compare the destination before opening it.
- Read HTML entities: Compare & and its decoded ampersand in text. Decoded markup is still untrusted input and should not be executed.
- Inspect Unicode escapes: Compare literal escapes with actual characters. The current forward encoder does not preserve complete surrogate pairs for emoji; retain the source and use a suitable destination encoder for those characters.
- Inspect query parameters: Compare repeated keys such as tag=a&tag=b with the original URL. This tool flattens them to the final value b, so retain the source URL when all values matter.
- Convert a numeric base: Use 255 and FF as a small check, specify the input base and avoid treating account IDs with leading zeroes as numbers.
An editorial example to compare
Make the acceptance condition visible
A URL is decoded repeatedly until it looks readable, then the result replaces the original ticket.
The original is retained; one query component is decoded, plus signs and repeated keys are checked, and the restored value is re-encoded once.
Keep A+B distinct from A B in a query
Use the illustrative URL https://example.com/?q=A%2BB&tag=a&tag=b. Query parsing gives q=A+B and two tag values, a and b. Writing q=A+B instead produces A B because a literal plus is interpreted as a space in query parsing. Encode a real plus as %2B. A space may be represented as + under query encoding; the sender’s encoding convention matters.
The URL codec uses encodeURIComponent and decodeURIComponent. Decoding the standalone text A+B does not replace its plus with a space, unlike query parsing. The URL-parameter tool currently produces a flat object and keeps only the last b for tag=a&tag=b. Retain the original URL when repeated keys matter. That object is not a lossless query backup.
| Query fragment | Parsed q | Reason |
|---|---|---|
| q=A%2BB | A+B | %2B preserves a literal plus |
| q=A+B | A B | Literal plus is parsed as a space |
| q=A%20B | A B | %20 also represents a space |
Use one fixed string to check the byte convention
For the illustrative string A+B 中😀, the UTF-8 hexadecimal bytes are 41 2B 42 20 E4 B8 AD F0 9F 98 80. Its standard Base64 representation is QStCIOS4rfCfmIA=. The Chinese character occupies three UTF-8 bytes and the emoji four; visible character count is not byte length.
Reverse QStCIOS4rfCfmIA= in the Base64 text tool and compare with A+B 中😀. This tool encodes and decodes text as UTF-8. Binary images need an image workflow with the media type retained. Text from another character encoding can yield replacement characters when treated as UTF-8. A readable re-encoding does not establish recovery of already-lost source bytes.
An emoji escape needs the complete surrogate pair
The literal UTF-16 escape for A is \u0041 and for 中 is \u4e2d. 😀 uses two UTF-16 code units, represented as the complete pair \ud83d\ude00. The first half alone, \ud83d, is not the complete emoji. JSON.stringify("😀") can also retain the visible emoji, so backslashes are not the sole sign of valid representation.
The current Unicode tool has a forward-encoding limitation for supplementary-plane characters: it can omit the low surrogate. Do not use that export for production text containing these characters. Preserve the source string and verify a round trip with an encoder and parser for the required destination format. Decoding a complete pair and generating a complete pair are separate capabilities; success in one direction does not establish success in the other.
Check the final result and preserve evidence
MDN documents repeated query keys and parsing behavior; preserve the original when inspecting a query.
For image payload failures, check the Data URL prefix separately. When decoded content is a data file, check its data structure next.
Acceptance checks
- The expected text matches after one deliberate round trip.
- The image opens with the expected type and dimensions.
- No secret token or personal data is included in the debugging copy.
Common questions
Why did a plus sign become a space?
Query-string conventions may interpret plus as a space. Compare the raw URL with the parsed value and the sender’s encoding convention.
Is readable Base64 confidential?
No. Anyone with the value can generally decode it; remove secrets before sharing a sample.
Can numeric conversion preserve 0012 as an ID?
An identifier is text. Keep its original string rather than assuming a number conversion preserves its formatting.
Further reading & sources
Put the guide into practice
Open the relevant tool, preview the result and check your exported file.
