Afbeelding naar Base64

Afbeelding naar Base64 is een gratis tool die een afbeeldingsbestand omzet in een Base64-gecodeerde tekstreeks.

Wat is Base64 en waarvoor wordt het gebruikt?

Base64 zet de binaire gegevens van de geüploade afbeelding om naar tekst, zodat ze kunnen worden verwerkt door systemen die voornamelijk voor tekst zijn ontworpen. Elke drie bytes aan brongegevens worden weergegeven als vier afdrukbare tekens uit een vast alfabet.

Dat is handig als een indeling geen afzonderlijk binair bestand kan bevatten. Je kunt een afbeelding opnemen in een data-URL, een JSON-eigenschap of een MIME-onderdeel van een e-mail, zonder de oorspronkelijke bytes in hun gebruikelijke binaire vorm bij te voegen. De gegenereerde Base64-tekenreeks is gecodeerd, niet versleuteld. Iedereen die de tekenreeks in handen krijgt, kan deze decoderen. Base64 biedt dus geen geheimhouding of toegangscontrole.

Een klein voorbeeld met tekstbytes laat zien hoe dit werkt.

• De invoertekst is <svg></svg>
• De Base64-uitvoer is PHN2Zz48L3N2Zz4=

De meeste afbeeldingen bestaan uit binaire bytes en niet uit leesbare opmaakcode. De invoer ziet er daarom meestal niet uit zoals in het tekstvoorbeeld. Het principe is hetzelfde voor PNG, JPEG, GIF, WebP en andere afbeeldingsindelingen.

Hoe zet ik een afbeelding om naar Base64?

Voer de afbeelding in, start de omzetting en kopieer de waarde uit het veld Base64-gecodeerd. De tool past de PHP-functie base64_encode toe op de afbeeldingsgegevens.

1. Selecteer de afbeelding die je als tekst wilt weergeven.
2. Wacht tot de pagina het bestand heeft verwerkt en de gecodeerde waarde toont.
3. Kopieer de volledige tekenreeks, inclusief eventuele gelijktekens aan het einde.
4. Voeg de benodigde omringende syntaxis toe als de bestemming een data-URL, JSON-waarde of andere container verwacht.

De verwerking vindt plaats op de server. Je afbeelding wordt via HTTPS naar de server verzonden en niet opgeslagen. Omdat de verwerking op de server gebeurt, mag je er niet van uitgaan dat het bestand tijdens de omzetting op je apparaat blijft.

Hoe gebruik ik de resulterende Base64-tekenreeks?

Gebruik de tekenreeks als ruwe Base64 of plaats deze in de syntaxis die het ontvangende systeem vereist. Base64 bevat zelf geen informatie over de afbeeldingsindeling, bestandsnaam, afmetingen of het beoogde gebruik.

In een data-URL voor HTML of CSS komt de gecodeerde waarde normaal gesproken na een mediatype en de Base64-markering. Een data-URL voor PNG begint met data:image/png;base64,, direct gevolgd door de tekenreeks. Voor JPEG gebruik je image/jpeg en voor SVG wordt doorgaans image/svg+xml gebruikt. Met het verkeerde mediatype kan software een verder geldige afbeelding mogelijk niet weergeven.

In JSON wordt Base64 normaal gesproken opgeslagen als een tekenreeks tussen aanhalingstekens, vaak naast een apart veld waarin het mediatype staat. Voeg geen data-URL-voorvoegsel toe als een API specifiek om ruwe Base64 vraagt. Lees de API-documentatie voordat je de geretourneerde waarde gebruikt, want deze twee soorten invoer zijn niet onderling uitwisselbaar.

Waar kom ik Base64 in de praktijk tegen?

Base64 wordt vaak gebruikt wanneer binaire gegevens via een tekstgebaseerde indeling of protocol moeten worden verzonden. Veelvoorkomende toepassingen zijn:

• Data-URL's die zijn ingesloten in HTML, CSS of gegenereerde documenten.
• JSON-payloads voor API's die afbeeldingsinhoud in een teksteigenschap accepteren.
• E-mailberichten, waarin MIME bijlagen en ingesloten afbeeldingen als Base64 kan coderen.
• Queryreeksen, al moeten standaard Base64-tekens mogelijk ook URL-gecodeerd worden.
• Configuratiebestanden en XML-documenten die niet rechtstreeks willekeurige binaire bytes kunnen bevatten.

Geïnternationaliseerde domeinnamen zijn een ander voorbeeld waarbij gegevens worden omgezet naar een beperkte tekenset, maar daarvoor wordt Punycode gebruikt in plaats van Base64. Voor waarden in een URL kan daarnaast een URL-encoder nodig zijn, omdat standaard Base64 plustekens, schuine strepen en gelijktekens kan bevatten.

Waarom mislukt het decoderen van Base64 of krijg ik onleesbare tekens?

Het decoderen kan mislukken doordat de invoer een meegekopieerd voorvoegsel bevat, beschadigd of afgekapt is, of niet overeenkomt met de Base64-indeling die de decoder verwacht. Onleesbare tekens betekenen vaak dat geldige binaire afbeeldingsgegevens zijn gedecodeerd en daarna ten onrechte als gewone tekst worden weergegeven.

• Een meegekopieerd voorvoegsel kan problemen veroorzaken wanneer een decoder alleen Base64 verwacht. Verwijder tekst zoals data:image/png;base64, voordat je een decoder voor ruwe Base64 gebruikt.
• Beschadigde of afgekorte invoer kan resulteren in een onvolledige afbeelding die niet door afbeeldingsviewers kan worden geopend.
• Dubbele codering levert na de eerste decodeerstap opnieuw een Base64-tekenreeks op. Mogelijk moet je een tweede keer decoderen als de bron een al gecodeerde waarde nogmaals heeft gecodeerd.
• Een verkeerd alfabet kan een fout veroorzaken als de decoder een andere variant verwacht. Base64url gebruikt koppeltekens en underscores op de plaatsen waar standaard Base64 plustekens en schuine strepen gebruikt.
• Ontbrekende opvulling kan problemen geven bij strikte decoders. Standaard Base64 kan eindigen op een of twee gelijktekens, hoewel sommige systemen deze bewust weglaten.

Als het gedecodeerde resultaat binair is, sla het dan op met het juiste afbeeldingstype in plaats van het in een teksteditor te openen. De Base64-decoder of Base64 naar afbeelding kan helpen bij de omgekeerde bewerking, mits de tekenreeks volledig is en de verwachte indeling gebruikt.

Indelingskeuzes en lastige invoer

Standaard Base64 is geschikt voor e-mail, data-URL's en systemen die er expliciet om vragen. Gebruik voor URL-paden, queryparameters en tokens de variant die het ontvangende systeem vereist. Base64url kan geschikt zijn als de specificatie dat voorschrijft. Deze tool gebruikt de standaardbewerking base64_encode van PHP. Ga er daarom niet van uit dat het resultaat Base64url is.

Deze tool codeert de bytes van de geüploade afbeelding. Spaties, leestekens, cijfers, tekens met accenten en niet-Latijnse tekst in een SVG of in afbeeldingsmetadata worden als onderdeel van die bytes gecodeerd. Een bestandsnaam met zulke tekens staat los van de bestandsinhoud en wordt niet automatisch door Base64 weergegeven.

In PHP retourneert base64_encode een lege waarde voor een lege bytereeks. Lange bestanden leveren lange tekenreeksen op. Base64 voegt ongeveer een derde toe aan het oorspronkelijke aantal bytes, nog voordat eventuele omringende JSON- of data-URL-syntaxis wordt meegerekend. Base64 comprimeert een afbeelding niet, verbetert de kwaliteit niet en verandert de pixelafmetingen niet.

Veelgestelde vragen

Kan ik een Base64-afbeelding rechtstreeks in CSS gebruiken?

Ja, CSS-eigenschappen die afbeeldings-URL's accepteren, kunnen een correct opgebouwde data-URL gebruiken. Dit werkt goed voor kleine, zelfstandige bestanden. Grotere ingesloten afbeeldingen maken het stylesheet echter groter en kunnen niet los van het CSS-bestand in de cache worden opgeslagen.

Waarom bevat mijn Base64-tekenreeks regeleinden?

Deze tool retourneert één ononderbroken waarde, omdat de PHP-functie base64_encode geen regeleinden invoegt. Regeleinden zijn dus later ontstaan door kopiëren of verdere verwerking. Veel decoders negeren witruimte, maar strikte API's kunnen deze weigeren. Gebruik daarom een ononderbroken tekenreeks als de specificatie van het ontvangende systeem dat vereist.

Verandert de Base64-waarde als ik de bestandsnaam van een afbeelding wijzig?

Base64 vertegenwoordigt de bytes van het bestand, niet de bestandsnaam. Als je een ongewijzigd bestand hernoemt, verandert de codering dus niet. Het bewerken van metadata, opnieuw opslaan van de afbeelding of omzetten naar een andere indeling verandert de bytes wel en levert een andere tekenreeks op.

Kan Base64 een privéafbeelding beveiligen?

Nee, Base64 kan zonder wachtwoord of geheime sleutel ongedaan worden gemaakt. Gebruik voor vertrouwelijk materiaal geschikte versleuteling, authenticatie en toegangscontroles. Houd er ook rekening mee dat deze tool de afbeelding voor verwerking via HTTPS naar de server verzendt.

Hoe controleer ik of de omzetting is gelukt?

Decodeer de volledige tekenreeks en open het resultaat in een afbeeldingsviewer die de oorspronkelijke indeling ondersteunt. Controleer of de afmetingen en zichtbare inhoud overeenkomen met de bron. Laat eventuele opvullingstekens aan het einde staan, tenzij het ontvangende systeem expliciet vereist dat je ze verwijdert.