Encoding and decoding URLs in Node.js - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is URL encoding and why is it important?

URL encoding converts characters into a format that can be transmitted over the internet. It replaces unsafe ASCII characters with a '%' followed by two hexadecimal digits. This ensures URLs are valid and data is correctly interpreted.

beginner

Which Node.js global functions are used to encode and decode URLs?

encodeURIComponent() is used to encode a URI component by escaping characters. decodeURIComponent() reverses this process, decoding the encoded URI component back to its original form.

intermediate

What is the difference between encodeURI() and encodeURIComponent() in Node.js?

encodeURI() encodes a full URI but leaves characters like '/', ':', and '?' intact. encodeURIComponent() encodes every character that is not a letter, number, or one of a few special characters, making it safer for encoding query parameters.

beginner

How do you decode a URL string in Node.js?

Use decodeURIComponent() to convert an encoded URL component back to its original string. For example, decodeURIComponent('%20') returns a space character.

beginner

Why should you encode query parameters in URLs?

Query parameters may contain special characters like spaces or '&' that can break the URL or cause errors. Encoding ensures these characters are safely transmitted and correctly interpreted by servers and browsers.

Which function should you use to encode a query parameter in Node.js?

A decodeURI()

B encodeURI()

C decodeURIComponent()

D encodeURIComponent()

encodeURIComponent() safely encodes query parameters by escaping all characters that could break the URL.

What does decodeURIComponent('%20') return?

A A space character

B The string '%20'

C An error

D A plus sign (+)

The encoded '%20' represents a space character, so decoding it returns a space.

Which characters does encodeURI() NOT encode?

A All special characters

B Characters like '/', ':', and '?'

C Only letters and numbers

D Spaces only

encodeURI() leaves URI reserved characters like '/', ':', and '?' unencoded to preserve URI structure.

Why is URL encoding necessary?

A To make URLs safe for transmission by replacing unsafe characters

B To shorten URLs

C To encrypt URLs

D To add colors to URLs

Encoding replaces unsafe characters with safe codes so URLs work correctly across the internet.

Which function reverses the encoding done by encodeURIComponent()?

A encodeURI()

B decodeURI()

C decodeURIComponent()

D escape()

decodeURIComponent() decodes strings encoded by encodeURIComponent(), restoring original characters.

Explain how and why you would encode and decode URLs in a Node.js application.

Think about sending data in URLs and how special characters affect them.

Describe the difference between encodeURI() and encodeURIComponent() with examples.

Consider when you want to encode a full link versus just a piece of it.

Practice

1. What does the encodeURIComponent function do in Node.js?

easy

A. It decodes an encoded URL string back to normal text.

B. It parses a URL into its components.

C. It sends an HTTP request to a URL.

D. It converts special characters in a string into a format safe for URLs.

Solution

1. Step 1: Understand the purpose of encoding URLs

   Encoding converts special characters like spaces or symbols into a safe format for URLs.

2. Step 2: Identify the role of encodeURIComponent

   This function specifically encodes parts of a URL so they can be safely transmitted.

3. Final Answer:

   It converts special characters in a string into a format safe for URLs. -> Option D

4. Quick Check:

   Encoding = safe URL string [OK]

Hint: Encoding makes URL parts safe by replacing special characters [OK]

Common Mistakes:

• Confusing encoding with decoding
• Thinking it sends HTTP requests
• Assuming it parses URLs

2. Which of the following is the correct syntax to decode a URL-encoded string in Node.js?

easy

A. decodeURIComponent('https%3A%2F%2Fexample.com')

B. decodeURI('https://example.com')

C. encodeURIComponent('https://example.com')

D. encodeURI('https%3A%2F%2Fexample.com')

Solution

1. Step 1: Identify the function to decode URL components

   decodeURIComponent is used to decode encoded parts of a URL.

2. Step 2: Check the syntax correctness

   The syntax decodeURIComponent('https%3A%2F%2Fexample.com') correctly decodes the encoded string.

3. Final Answer:

   decodeURIComponent('https%3A%2F%2Fexample.com') -> Option A

4. Quick Check:

   Decoding syntax = decodeURIComponent() [OK]

Hint: Use decodeURIComponent() to decode encoded URL parts [OK]

Common Mistakes:

• Using encode functions to decode
• Using decodeURI which decodes less strictly
• Mixing encodeURI and decodeURIComponent

3. What will be the output of the following Node.js code?

const encoded = encodeURIComponent('Hello World!');
console.log(encoded);

medium

A. Hello%World%!

B. Hello+World!

C. Hello%20World%21

D. Hello World!

Solution

1. Step 1: Understand what encodeURIComponent does to spaces and special characters

   Spaces become %20 and exclamation marks become %21 in encoding.

2. Step 2: Apply encoding to 'Hello World!'

   The space is replaced by %20 and '!' by %21, resulting in 'Hello%20World%21'.

3. Final Answer:

   Hello%20World%21 -> Option C

4. Quick Check:

   Space = %20, ! = %21 [OK]

Hint: Spaces become %20, special chars like ! become %21 [OK]

Common Mistakes:

• Expecting spaces to become '+'
• Confusing encodeURI with encodeURIComponent
• Not encoding special characters

4. Identify the error in this Node.js code snippet:

const url = 'https://example.com/search?query=Node.js';
const encodedUrl = encodeURIComponent(url);
console.log(encodedUrl);

medium

A. No error; code works correctly.

B. Should use encodeURI instead of encodeURIComponent for full URLs.

C. Missing decodeURIComponent call after encoding.

D. encodeURIComponent cannot encode dots ('.').

Solution

1. Step 1: Understand difference between encodeURI and encodeURIComponent

   encodeURIComponent encodes all special characters, including ':' and '/', which breaks full URLs.

2. Step 2: Identify correct function for full URLs

   encodeURI is designed to encode full URLs without breaking their structure.

3. Final Answer:

   Should use encodeURI instead of encodeURIComponent for full URLs. -> Option B

4. Quick Check:

   Full URL encoding = encodeURI() [OK]

Hint: Use encodeURI for full URLs, encodeURIComponent for parts [OK]

Common Mistakes:

• Using encodeURIComponent on full URLs
• Expecting decode after encoding always
• Thinking dots cannot be encoded

5. You want to safely encode a URL query parameter that contains an email address like [e-mail]. Which code snippet correctly encodes this parameter for use in a URL?

hard

A. const param = encodeURIComponent('[e-mail]');

B. const param = encodeURI('[e-mail]').replace(/@/g, '+');

C. const param = encodeURIComponent('[e-mail]').replace(/%40/g, '@');

D. const param = encodeURI('[e-mail]');

Solution

1. Step 1: Determine correct encoding for query parameters

   Query parameters should be encoded with encodeURIComponent to encode special characters like '@'.

2. Step 2: Check each option's correctness

   const param = encodeURI('[e-mail]'); uses encodeURI which does not encode '@'. const param = encodeURI('[e-mail]').replace(/@/g, '+'); uses encodeURI and replaces '@' with '+', but '+' is interpreted as space in query strings. const param = encodeURIComponent('[e-mail]').replace(/%40/g, '@'); uses encodeURIComponent but then decodes '%40' back to '@'. const param = encodeURIComponent('[e-mail]');: const param = encodeURIComponent('[e-mail]'); correctly encodes '@' as '%40'.

3. Final Answer:

   const param = encodeURIComponent('[e-mail]'); -> Option A

4. Quick Check:

   Query param encoding = encodeURIComponent() [OK]

Hint: Use encodeURIComponent for query parameters including emails [OK]

Common Mistakes:

• Using encodeURI for query parameters
• Manually replacing encoded characters incorrectly
• Not encoding '@' in emails