Decodificatore Base64 per Immagini | Decodifica e Anteprima Immagini Online

Che cos'è un decodificatore di immagini Base64?

Un decodificatore di immagini Base64 è uno strumento che trasforma una stringa di testo codificata in Base64 nuovamente in un'immagine. Base64 è un modo per scrivere dati binari, come i byte di un file immagine, usando soltanto 64 caratteri di testo semplice: lettere, cifre, +, / e = per il riempimento. Browser, email e molte API memorizzano le immagini in questo modo, così un'immagine può viaggiare all'interno di testo semplice invece che come file separato. Il decodificatore inverte il processo: si incolla la stringa e appare l'immagine originale.

Il formato dell'URL dati

Sul web, un'immagine Base64 viene generalmente scritta come URL dati. Lo schema è:

Ad esempio:

Ogni parte ha una funzione:

• data: indica che si tratta di un URL dati, non di un normale indirizzo web.
• image/png è il tipo MIME, che comunica al browser il tipo di file.
• ;base64 indica che i dati dopo la virgola sono codificati in Base64.
• Tutto ciò che segue la virgola è l'immagine codificata.

Come funziona il decodificatore

La decodifica avviene in quattro passaggi.

1. Lo strumento controlla se la stringa inizia con data:. Un URL dati che indica un tipo di supporto diverso da un'immagine, come data:text/plain, viene rifiutato immediatamente, perché non può essere visualizzato come immagine.
2. Elimina spazi, tabulazioni e interruzioni di riga, poiché le stringhe Base64 lunghe a volte vengono distribuite su più righe. Un payload che usa la codifica percentuale invece di Base64, anch'essa consentita da RFC 2397, viene lasciato invariato.
3. Decodifica il testo Base64 riportandolo ai byte grezzi.
4. Esamina i primi byte del risultato. Ogni formato di immagine comune inizia con una sequenza fissa di byte, chiamata firma o “numero magico”. I file PNG iniziano con 89 50 4E 47, i file JPEG iniziano con FF D8 FF e così via. Il decodificatore confronta queste firme e assegna all'immagine il tipo che identificano.

I byte prevalgono sull'etichetta. Se un URL dati indica data:image/png, ma i byte iniziano con FF D8 FF, il decodificatore ricostruisce l'URL come data:image/jpeg, così la stringa fornita dal pulsante “Copia URL immagine” non descrive mai in modo errato il proprio contenuto.

Se la stringa non ha il prefisso data:, il decodificatore la tratta come dati Base64 grezzi, li decodifica e legge la firma nello stesso modo. Se i byte non corrispondono ad alcuna firma di immagine conosciuta e non sembrano testo SVG, il decodificatore segnala che la stringa non sembra essere un'immagine. Non prova a indovinare il formato e non ricorre a un tipo predefinito.

SVG viene gestito in modo diverso perché è un formato testuale (XML), non binario, quindi non possiede una firma fissa in byte. Il decodificatore controlla i primi 1.024 byte del testo decodificato alla ricerca di un tag <svg, di una dichiarazione XML come <?xml version="1.0"?> seguita da tale tag, oppure di una dichiarazione del tipo di documento SVG seguita dallo stesso tag. Un indicatore dell'ordine dei byte all'inizio, aggiunto da alcuni editor ai file UTF-8, viene ignorato. Poiché SVG non può essere identificato tramite una firma in byte, un URL dati che dichiara image/svg+xml mantiene il tipo dichiarato.

Formula per la dimensione di un'immagine Base64

Base64 trasforma ogni 3 byte di dati binari in 4 caratteri di testo. La formula per la lunghezza codificata è:

I simboli ⌈ ⌉ significano “arrotondare per eccesso al numero intero successivo”, perché Base64 lavora sempre in gruppi di 4 caratteri e riempie con simboli = il gruppo incompleto.

Per i file di grandi dimensioni, il risultato è un aumento di circa il 33%, poiché 4 ÷ 3 ≈ 1,33. I file piccoli possono mostrare un aumento percentuale maggiore, perché l'arrotondamento al gruppo successivo di 4 caratteri incide di più quando i dati iniziali sono pochi.

Esempio di calcolo

L'esempio PNG precedente viene decodificato in 85 byte di dati immagine. Applicando la formula:

La stringa Base64 è infatti lunga 116 caratteri, come previsto. Si tratta di un aumento del 36% rispetto agli 85 byte originali (116 ÷ 85 ≈ 1,36), leggermente superiore al valore del 33% perché il file è molto piccolo.

Formati di immagine supportati

Il decodificatore legge la firma in byte dei dati decodificati per identificare il formato. Riconosce questi tipi:

Come decodificare un'immagine Base64

1. Copiare la stringa Base64, con o senza il prefisso data:image/..., da HTML, CSS, una risposta API o un'email.
2. Incollarla nella casella di input.
3. L'immagine viene decodificata automaticamente poco dopo aver smesso di digitare oppure premendo il pulsante di decodifica.
4. L'immagine decodificata appare nell'area di anteprima. Il relativo URL dati può essere copiato con il pulsante “Copia URL immagine”; l'immagine stessa può essere salvata facendo clic con il tasto destro su di essa nell'anteprima e scegliendo di salvare l'immagine, poiché viene visualizzata come un normale elemento immagine nel browser.

Usi comuni delle immagini Base64

• Incorporamento in HTML, CSS o JavaScript: inserire i dati dell'immagine direttamente nel codice evita una richiesta separata per il file.
• Modelli email: alcuni client di posta bloccano per impostazione predefinita le immagini collegate esternamente, mentre un'immagine Base64 incorporata continua a essere visualizzata.
• Strumenti HTML in un unico file: un'intera pagina, comprese le immagini, può essere distribuita come un singolo file autonomo.
• Risposte API: un'immagine può viaggiare all'interno di un payload JSON senza richiedere un endpoint separato.
• Sfondi e icone CSS: le icone piccole a volte vengono scritte direttamente in un foglio di stile come URL dati.

Compromessi delle immagini Base64

La codifica Base64 è comoda, ma comporta alcuni costi:

• Il testo codificato è più grande di circa un terzo rispetto al file originale.
• I browser non possono memorizzare nella cache un'immagine incorporata nello stesso modo di un file collegato, quindi la scaricano nuovamente ogni volta che viene caricata la pagina o il foglio di stile che la contiene.
• Il browser deve decodificare il testo Base64 prima di poter visualizzare l'immagine, con una piccola elaborazione aggiuntiva.
• A causa dell'aumento delle dimensioni e della perdita della memorizzazione nella cache, l'incorporamento Base64 è adatto a immagini piccole, come icone e loghi semplici. Per le foto più grandi, di solito è preferibile usare normali file immagine.

Domande frequenti

Che cos'è un decodificatore di immagini Base64?

È uno strumento che converte una stringa di testo codificata in Base64 in un'immagine visualizzabile, ad esempio un file PNG, JPEG, GIF, WebP, BMP o SVG.

Come si decodifica un'immagine Base64?

Incollare la stringa Base64, con o senza il prefisso data:image/..., nel decodificatore. Lo strumento leggerà e decodificherà la stringa, quindi mostrerà l'immagine risultante.

È possibile decodificare una stringa Base64 senza il prefisso dell'URL dati?

Sì. Il decodificatore la tratta come dati Base64 grezzi, decodifica i byte e legge i primi byte per identificare il formato dalla firma, ad esempio PNG, JPEG, GIF, WebP, BMP o ICO. SVG viene identificato cercando un tag <svg nel testo decodificato. Se nessuno di questi elementi corrisponde, il decodificatore segnala che la stringa non sembra essere un'immagine invece di provare a indovinare il formato.

Perché la mia immagine Base64 non viene decodificata?

Tre cause spiegano la maggior parte dei casi. La stringa può contenere caratteri esterni all'alfabeto Base64 standard, formato da A–Z, a–z, 0–9, +, / e =; la variante base64url usata in alcuni token web utilizza invece - e _ e non viene accettata. La stringa potrebbe essere stata troncata, lasciando una lunghezza superiore di uno a un multiplo di quattro, cosa che una stringa Base64 valida non presenta mai. Oppure i byte potrebbero semplicemente non appartenere a uno dei formati di immagine supportati. L'assenza del riempimento = da sola non è un problema; spazi e interruzioni di riga vengono rimossi prima della decodifica.

La codifica Base64 è una forma di sicurezza o crittografia?

No. Base64 è soltanto un modo per rappresentare i byte come testo; non nasconde nulla. Chiunque può decodificare una stringa Base64 in pochi secondi con uno strumento gratuito, quindi non dovrebbe mai essere usata per proteggere immagini private o altri dati.

Quanto è più grande una stringa Base64 rispetto all'immagine originale?

Per i file più grandi, è più grande di circa un terzo, poiché ogni 3 byte dei dati originali diventano 4 caratteri di testo. Un'immagine da 100 KB diventa di circa 133 KB una volta codificata. Le immagini piccole possono mostrare un aumento percentuale leggermente maggiore a causa dell'arrotondamento.

Storia

Base64 deriva da schemi di codifica sviluppati negli anni 1970 e 1980 per inviare dati binari attraverso sistemi di posta elettronica che gestivano soltanto testo semplice. La codifica è stata formalizzata per l'email in RFC 989 (1987) e successivamente in RFC 1421. Il suo utilizzo per incorporare immagini nelle pagine web è diventato possibile quando lo schema di URL data: è stato definito in RFC 2397 (1998). È diventato più comune a metà degli anni 2000, quando gli sviluppatori cercavano modi per ridurre le richieste HTTP separate, soprattutto sulle connessioni mobili lente.

Riferimenti

1. RFC 4648: codifiche dei dati Base16, Base32 e Base64
2. RFC 2397: lo schema di URL “data”
3. MDN Web Docs: URL dati
4. Standard WHATWG per il rilevamento dei tipi MIME