Decodificatore di immagini Base64

Cos'è la decodifica di immagini Base64?

La decodifica di immagini Base64 è l'opposto della codifica: prende una stringa Base64 o un data URI che rappresenta un'immagine e la converte nuovamente in dati binari visibili. Quando ricevi una stringa come data:image/png;base64,iVBORw0KGgo..., la decodifica rimuove il prefisso data URI, inverte la codifica Base64 definita in RFC 4648 e ricostruisce i byte originali dell'immagine. Il browser può quindi rendere i byte decodificati come un'immagine visibile.

I data URI (RFC 2397) raggruppano il tipo MIME e il contenuto codificato in Base64 in una singola stringa. Appaiono frequentemente nelle risposte API, nel codice sorgente delle e-mail HTML, nei fogli di stile CSS e nei record del database dove le immagini sono archiviate come testo anziché come file binari. Decodificare queste stringhe è necessario per visualizzare l'immagine, verificarne il contenuto o salvarla come file standalone. Poiché Base64 utilizza 4 caratteri ASCII per rappresentare ogni 3 byte di dati binari, la stringa codificata è sempre circa il 33% più grande dell'immagine originale.

Questo strumento analizza sia i data URI completi (data:image/png;base64,...) che le stringhe Base64 grezze senza il prefisso data:. Per le stringhe grezze, il formato dell'immagine viene rilevato automaticamente ispezionando i primi caratteri Base64, che corrispondono ai magic byte del file — ad esempio, iVBORw0KGgo indica sempre un file PNG. L'immagine decodificata viene resa direttamente nel browser e può essere scaricata come file.

Uno scenario comune è lavorare con un'API REST che restituisce una foto del profilo o una miniatura del documento come stringa Base64 all'interno di un campo JSON — ad esempio, {"avatar": "data:image/png;base64,iVBORw0KGgo..."}. Per utilizzare l'immagine, estrai il valore del campo, rimuovi il prefisso data URI fino alla virgola inclusa, quindi alimenta i caratteri Base64 rimanenti tramite un decodificatore come atob() in JavaScript o base64.b64decode() in Python per recuperare i byte grezzi. Incollare il valore completo in questo strumento salta tutti questi passaggi manuali e rende l'immagine istantaneamente.

Perché usare questo decodificatore di immagini Base64?

Questo strumento converte i dati dell'immagine Base64 di nuovo in un'immagine visualizzabile e scaricabile interamente nel tuo browser — nessun caricamento, nessuna elaborazione del server, nessun account richiesto.

Casi d'uso della decodifica di immagini Base64

Struttura data URI per immagini

Un data URI raggruppa il tipo di immagine e il contenuto codificato in una singola stringa. Ogni componente è essenziale per una decodifica corretta: lo schema (data:) segnala che l'URL è autonomo piuttosto che un riferimento a una risorsa esterna; il tipo MIME (ad esempio, image/png) indica al renderer quale formato utilizzare quando si interpretano i byte grezzi; il marcatore ;base64, distingue il contenuto codificato in Base64 dai data URI che utilizzano la codifica percentuale per i formati di testo semplice. Il payload Base64 stesso può terminare con uno o due caratteri di riempimento = — questi sono necessari quando il numero di byte di input non è un multiplo di tre, garantendo che la lunghezza codificata sia sempre un multiplo di quattro. L'omissione o il troncamento di uno di questi componenti causa l'errore di decodifica o produce un'immagine corrotta.

Rilevamento del formato immagine da Base64

Quando una stringa Base64 manca di un prefisso data:, il formato dell'immagine può essere identificato ispezionando i primi caratteri. Questi caratteri corrispondono ai magic byte del file — sequenze di byte fisse all'inizio di ogni file immagine che identificano il formato:

Esempi di codice

Come decodificare le stringhe dell'immagine Base64 nuovamente ai file immagine nei linguaggi e ambienti popolari:

// Decode a Base64 data URI to a Blob and create a download link
const dataUri = 'data:image/png;base64,iVBORw0KGgo...'

// Method 1: fetch API (simplest)
const res  = await fetch(dataUri)
const blob = await res.blob()
// blob.type → "image/png", blob.size → 2048

// Method 2: manual decode for older environments
const [header, b64] = dataUri.split(',')
const mime    = header.match(/:(.*?);/)[1]   // → "image/png"
const binary  = atob(b64)
const bytes   = Uint8Array.from(binary, c => c.charCodeAt(0))
const blob2   = new Blob([bytes], { type: mime })

// Create a download link
const url = URL.createObjectURL(blob)
const a   = document.createElement('a')
a.href = url
a.download = 'decoded.png'
a.click()
URL.revokeObjectURL(url)

import base64
import re

data_uri = 'data:image/png;base64,iVBORw0KGgo...'

# Parse the data URI
match = re.match(r'data:(image/[\w+.-]+);base64,(.+)', data_uri)
mime_type = match.group(1)    # → "image/png"
b64_data  = match.group(2)

# Decode and write to file
image_bytes = base64.b64decode(b64_data)
ext = mime_type.split('/')[1].replace('jpeg', 'jpg').replace('svg+xml', 'svg')

with open(f'output.{ext}', 'wb') as f:
    f.write(image_bytes)
# → writes output.png (byte-for-byte identical to the original)

# Decode raw Base64 (no data: prefix)
raw_b64 = 'iVBORw0KGgo...'
image_bytes = base64.b64decode(raw_b64)

import { writeFileSync } from 'fs'

const dataUri = 'data:image/png;base64,iVBORw0KGgo...'

// Extract MIME type and Base64 payload
const [meta, b64] = dataUri.split(',')
const mime = meta.match(/:(.*?);/)[1]  // → "image/png"

// Decode to Buffer and save
const buffer = Buffer.from(b64, 'base64')
writeFileSync('output.png', buffer)
// → output.png (identical to the original file)

// Validate by checking magic bytes
console.log(buffer.subarray(0, 4))
// PNG → <Buffer 89 50 4e 47>  (\x89PNG)
// JPEG → <Buffer ff d8 ff e0>

# Decode a raw Base64 string to an image file (Linux)
echo 'iVBORw0KGgo...' | base64 -d > output.png

# Decode a raw Base64 string to an image file (macOS)
echo 'iVBORw0KGgo...' | base64 -D > output.png

# Extract Base64 from a data URI and decode
echo 'data:image/png;base64,iVBORw0KGgo...' | \
  sed 's/^data:.*base64,//' | base64 -d > output.png

# Identify the image format from the decoded file
file output.png
# → output.png: PNG image data, 64 x 64, 8-bit/color RGBA

Domande frequenti