URL Encoding: Caratteri Speciali e Sicurezza Web

Capire l'URL Encoding

L'URL encoding (chiamato anche percent-encoding) è un meccanismo per codificare caratteri speciali negli URL. Poiché gli URL possono contenere solo un set limitato di caratteri ASCII, qualsiasi carattere fuori da questo set—o con significato speciale negli URL—deve essere codificato. Questa guida spiega come funziona l'URL encoding e perché è importante per la sicurezza web.

Perché l'URL Encoding è Necessario

Caratteri Riservati

Alcuni caratteri hanno significato speciale negli URL:

• ? - Inizia la query string
• & - Separa i parametri
• = - Separa chiave e valore
• # - Inizia l'identificatore di frammento
• / - Separatore di percorso
• : - Separatore di schema e porta
• @ - Separatore credenziali

Caratteri Non Sicuri

Alcuni caratteri possono causare problemi:

• Spazi - Possono essere interpretati come fine dell'URL
• Caratteri non-ASCII - Non supportati nella specifica URL originale
• < > " { } | \ ^ ~ - Possono essere modificati da gateway

Come Funziona l'URL Encoding

Il Formato Percent-Encoding

I caratteri sono codificati come %XX dove XX è il valore esadecimale del byte:

Spazio → %20
! → %21
# → %23
$ → %24
& → %26
' → %27
+ → %2B
/ → %2F
: → %3A
= → %3D
? → %3F
@ → %40

Esempi Pratici

// Testo originale
"Hello World!"

// URL encoded
"Hello%20World%21"

// Query con caratteri speciali
search?q=C++ programming&lang=it

// Codificato correttamente
search?q=C%2B%2B%20programming&lang=it

URL Encoding in JavaScript

Funzioni Built-in

// encodeURIComponent - per valori dei parametri
const value = "hello world & goodbye";
const encoded = encodeURIComponent(value);
// "hello%20world%20%26%20goodbye"

// encodeURI - per URL completi (preserva caratteri strutturali)
const url = "https://example.com/path?q=hello world";
const encodedUrl = encodeURI(url);
// "https://example.com/path?q=hello%20world"

// Decodifica
decodeURIComponent(encoded); // "hello world & goodbye"
decodeURI(encodedUrl); // URL originale

Quando Usare Quale

• encodeURIComponent - Per valori di parametri query
• encodeURI - Per URL completi con struttura
• URLSearchParams - Per costruire query string (gestisce encoding automaticamente)

// Approccio moderno con URLSearchParams
const params = new URLSearchParams({
  search: "C++ tutorial",
  category: "programming & development"
});

const url = `https://api.example.com/search?${params}`;
// https://api.example.com/search?search=C%2B%2B+tutorial&category=programming+%26+development

Implicazioni di Sicurezza

Prevenire l'Injection

L'URL encoding corretto previene attacchi injection:

// Input malevolo
const userInput = "search; DROP TABLE users--";

// Senza encoding (PERICOLOSO)
const badUrl = `/search?q=${userInput}`;

// Con encoding (SICURO)
const safeUrl = `/search?q=${encodeURIComponent(userInput)}`;
// /search?q=search%3B%20DROP%20TABLE%20users--

Double Encoding

Attenzione al double encoding—codificare dati già codificati:

const original = "hello world";
const encoded = encodeURIComponent(original); // "hello%20world"
const doubleEncoded = encodeURIComponent(encoded); // "hello%2520world"
// %25 è il % codificato, risultando in %2520 invece di %20

Best Practices

• Codifica Sempre i Dati Utente: Mai fidarsi dell'input non validato
• Usa le API Appropriate: URLSearchParams per query string
• Evita Double Encoding: Codifica solo una volta
• Decodifica al Momento Giusto: Decodifica solo quando necessario processare i dati
• Gestisci Unicode: Ricorda che i caratteri non-ASCII diventano sequenze multi-byte

Il Nostro Strumento URL Encoder

Usa il nostro URL Encoder/Decoder per codificare e decodificare URL rapidamente nel browser, senza inviare dati a server esterni.

Conclusione

L'URL encoding è fondamentale per costruire applicazioni web sicure e funzionanti. Capire quando e come codificare i caratteri speciali previene bug, vulnerabilità di sicurezza e problemi di compatibilità. Usa sempre le funzioni di encoding appropriate e tratta l'input utente come potenzialmente pericoloso.