UltKit

Convertor imagine în Base64

Transformați un fișier imagine într-o linie de text pe care o puteți lipi în HTML, CSS, o cerere JSON sau un fișier Markdown, cu prefixul data URI deja adăugat, ca să funcționeze imediat după lipire.

Convertor de date

sau trage Fișiere CSV, TSV, TXT … aici ·

Maximum 95 MB per fișier· Până la 20 fișiere· Șterse după 30 minute

Rezultat

Fișierele sunt procesate pe serverele noastre și șterse după 30 minute.

Cum se folosește acest instrument

  1. 1

    Adăugați imaginile

    Trageți fișiere PNG, JPG, GIF, WebP sau SVG în zona de încărcare, până la 20 odată, fiecare de maximum 95 MB.

  2. 2

    Păstrați sau eliminați prefixul

    Opțiunea Prefix Data URI este activată, deci rezultatul începe cu data:image/png;base64, sau cu tipul corespunzător. Dezactivați-o din Setări avansate când un API cere doar șirul Base64 simplu.

  3. 3

    Convertiți și copiați

    Apăsați Convertește în Base64 text și descărcați câte un fișier .txt pentru fiecare imagine, gata de lipit în cod.

Încărcați imaginea și apăsați Convertește în Base64 text. Obțineți fișierul codat ca simple caractere, începând cu data:image/…;base64, astfel încât să poată fi pus direct într-un img src sau într-un url() CSS. Imaginea rămâne neschimbată.

Când este utilă o imagine în Base64

Base64 este definit în RFC 4648 (2006) și transformă fiecare 3 octeți de date binare în 4 caractere dintr-un alfabet de 64 de caractere: A–Z, a–z, 0–9, + și /. Rezultatul rezistă în orice canal construit pentru text. Schema data URI, descrisă de Larry Masinter în RFC 2397 în 1998, permite apoi browserului să trateze acel text ca pe un fișier.

Dezvoltatorii front-end includ direct în pagină pictograme mici, animații de încărcare și imagini de umplere, pentru ca pagina să se afișeze fără cereri suplimentare. Dezvoltatorii back-end trimit imagini în JSON, fiindcă multe API-uri, inclusiv servicii de vedere artificială și OCR, acceptă imaginea ca un câmp Base64. Testerii păstrează fixture-uri în codul sursă, iar cei care fac rapoarte HTML dintr-un singur fișier sau notițe Markdown încorporează capturi de ecran, ca fișierul să rămână independent când este trimis prin e-mail sau arhivat.

Cum arată rezultatul Base64

Un PNG transparent de 1 × 1 (68 de octeți) ca data URI într-o etichetă img
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVR4nGNgAAIAAAUAAXpeqz8AAAAASUVORK5CYII=" width="1" height="1" alt="pixel de test">

Fișier pictogramă PNG

24 KB

set tipic de pictograme pentru bara de instrumente, 96 × 96 px

+33% mărime, zero schimbări de calitate

Text Base64

32 KB

4 caractere la 3 octeți, plus prefixul

ANY I

Orice imagine

Acest instrument acceptă formatele de imagine uzuale, printre care JPG, PNG, WebP, HEIC, GIF, BMP și TIFF. Formatul este detectat automat din fișier, așa că nu trebuie să știți ce tip de imagine aveți.

Convertor Any image

BASE64

Text codificat Base64

Base64 este o codificare, definită în RFC 4648, care transformă orice date binare într-un șir de 64 de caractere text sigure. Se folosește pentru a încorpora imagini în HTML și CSS ca URI de date, pentru a atașa fișiere la e-mail și pentru a trimite date binare în JSON sau XML. Codificarea este complet reversibilă, dar mărește datele cu aproximativ 33%. Base64 nu este criptare și nu oferă securitate; oricine îl poate decodifica.

Compresie
Fără pierderi
Transparență
–
Animație
–
Introdus în
–
Convertor BASE64

Imaginile devin text Base64 când trebuie să circule în ceva care transportă doar text: un fișier HTML sau CSS fără cerere separată, un câmp JSON dintr-un apel API, un fixture de test sau un raport dintr-un singur fișier.

Când ajută includerea imaginii în pagină și când o încetinește

Includerea directă economisește o cerere, lucru important mai ales sub HTTP/1.1, când browserele deschideau doar câteva conexiuni per site. Cu multiplexarea din HTTP/2 și HTTP/3, cererile mici în plus sunt ieftine, deci avantajul scade, dar costurile rămân: imaginea codată nu poate fi pusă separat în cache, este descărcată din nou ori de câte ori se schimbă HTML-ul sau CSS-ul și întârzie procesarea fișierului în care se află.

O regulă rezonabilă este să includeți direct doar imagini de câțiva kilobiți care apar pe fiecare pagină, cum ar fi un logo sau un sprite de pictograme, și să serviți restul ca fișiere. Fotografiile aproape niciodată nu se potrivesc inline. Dacă de fapt aveți nevoie de alt tip de fișier, nu de text, convertorul de imagini se ocupă de asta.

Avantajele imaginilor Base64

  • Un singur fișier HTML, CSS sau JSON independent
  • Nicio cerere suplimentară pentru pictograme mici
  • Sigur în JSON, XML și alte formate text
  • Fără pierderi și reversibil

Costurile imaginilor Base64

  • Cu aproximativ 33% mai mare decât fișierul binar
  • Nu este pus separat în cache de browser
  • Blocat ca imagine de multe aplicații de e-mail
  • Greu de verificat în diferențele de cod

Întrebări despre conversia imaginilor în Base64

Care este diferența dintre Base64 și un data URI?

Base64 înseamnă doar caracterele codate. Un data URI le învelește într-o schemă și un tip, data:image/png;base64, urmate de caractere, astfel încât browserul să știe cum să le decodeze și să le afișeze. HTML și CSS au nevoie de data URI complet; majoritatea API-urilor JSON cer doar partea Base64 simplă.

Cu cât crește o imagine codificată în Base64?

Base64 scrie 4 caractere pentru fiecare 3 octeți, deci textul este cu aproximativ o treime mai mare decât fișierul, plus prefixul scurt. Un PNG de 30 KB devine aproximativ 40 KB de text. Dacă HTML-ul sau CSS-ul este servit comprimat cu gzip, o parte din această creștere se recuperează la transfer.

Pot folosi o imagine Base64 într-o semnătură de e-mail?

Nu este de încredere. Gmail nu afișează imaginile data URI, iar mai multe programe de e-mail pentru desktop le elimină, așa că destinatarii văd o pictogramă ruptă. Găzduiți imaginea pe un server web sau atașați-o și păstrați Base64 pentru pagini web și aplicații.

Merită codificată în Base64 o pictogramă SVG?

Funcționează, dar SVG este deja text. Codarea URL a codului în loc de Base64 dă de obicei un data URI mai scurt și îl păstrează lizibil. Pentru orice depășește o pictogramă mică, un fișier SVG separat, pe care browserul îl poate păstra în cache, este alegerea mai bună.

Pot transforma textul Base64 înapoi în imagine?

Da, codarea este fără pierderi și complet reversibilă: decodarea returnează exact octeții originali. Orice limbaj de programare include un decodor, iar lipirea unui data URI complet în bara de adrese a browserului afișează imaginea.

Codificarea modifică calitatea imaginii?

Nu. Base64 schimbă modul în care sunt scriși octeții, nu pixelii. Pentru un șir mai scurt, micșorați mai întâi imaginea, de exemplu cu comprimare imagine la 20 KB, și codați fișierul mai mic.