Come si usa
- Incolla la stringa Base64 o l’intero URI data:image/png;base64.
- Controlla l’anteprima. Le aree trasparenti appaiono sopra un motivo a scacchiera.
- Lascia PNG in Scarica come. Se i dati sono JPEG, WebP o un altro formato, vengono convertiti in PNG nel browser.
- Scarica il file .png.
Da dove arrivano i PNG in Base64
PNG è il formato che incontrerai più spesso in Base64. Chiamando canvas.toDataURL() senza argomenti si ottiene un data URI PNG. Gli strumenti di automazione del browser restituiscono gli screenshot come PNG in Base64, per esempio page.screenshot({ encoding: 'base64' }) in Puppeteer o get_screenshot_as_base64() in Selenium. Servizi di rendering di grafici, generatori di codici QR e API di generazione di immagini spesso restituiscono l’immagine come campo Base64 all’interno di un JSON.
Una stringa PNG è facile da riconoscere: inizia sempre con iVBORw0KGgo, la codifica della firma PNG di 8 byte che comincia con 89 50 4E 47. Segue AAAANSUhEUg, cioè l’inizio del chunk IHDR che contiene larghezza e altezza.
Le stringhe copiate da un JSON vanno prima controllate. La funzione json_encode di PHP, per esempio, applica per impostazione predefinita l’escape alle barre, quindi un PNG proveniente da un’API PHP può arrivare con sequenze \/. Sostituiscile con / e rimuovi le virgolette che racchiudono la stringa prima di incollarla.
Perché salvare in PNG
PNG comprime senza perdere alcun dettaglio e memorizza un canale alfa completo, quindi le ombre sfumate e i bordi con antialiasing restano intatti. Per questo è la scelta naturale per screenshot, elementi di interfaccia, diagrammi e qualsiasi immagine che contenga testo. Per le fotografie, JPG o WebP producono file molto più piccoli.
Convertire un JPEG o un WebP in PNG conserva esattamente ciò che vedi sullo schermo, ma non può recuperare i dettagli già eliminati dalla compressione con perdita, e di solito il PNG è più grande del file di partenza.
Salvare un PNG in Base64 dal codice
# Python
import base64
with open('screenshot.png', 'wb') as f:
f.write(base64.b64decode(b64_string))
// Browser: da data URI a Blob, senza decodifica manuale
const blob = await (await fetch(dataUri)).blob();
const url = URL.createObjectURL(blob);Ti serve la direzione opposta? PNG in Base64 codifica un file in una stringa o in un data URI.
Domande frequenti
Come faccio a capire se una stringa Base64 è un PNG?
iVBORw0KGgo. Lo strumento legge anche direttamente i byte della firma, quindi indica il formato reale anche se il data URI dice altro.La conversione in PNG riduce la qualità?
No. PNG è lossless, quindi i pixel vengono memorizzati esattamente come li ha decodificati il browser. L’unica perdita possibile è quella già avvenuta nel file di origine.
La trasparenza viene mantenuta?
Sì. L’output PNG mantiene il canale alfa completo. L’output JPEG riempie di bianco le aree trasparenti, mentre l’output GIF rende ogni pixel completamente trasparente o completamente opaco.
Il mio data URI PNG mostra un’immagine rotta. Qual è il problema?
\/.