Convertidor Base64 DataURL

Base64 pur
0 caràcters

Eina en línia per a la conversió bidireccional entre Base64 pur i DataURL amb detecció automàtica de MIME i eliminació d'espais.

Relacionats

Codificació Base64

Descodificació Base64

Base64 fusió de múltiples línies

Base64 a imatge

Imatge a Base64

Neteja Base64

Què és Base64 DataURL?

DataURL és un esquema URI que incrusta dades directament a l'URL amb el format data:[<tipus MIME>];base64,<dades Base64>. Permet incrustar imatges, PDF, fonts i altres recursos petits directament a HTML, CSS i JavaScript sense peticions HTTP addicionals.

**Base64 pur vs DataURL:** Base64 pur és només una cadena codificada (p. ex. iVBORw0KGgo...); DataURL és un URI complet amb el prefix data: i el tipus MIME, que es pot fer servir directament com a valor de src, href, url(), etc.

**Finalitat d'aquesta eina:** Conversió bidireccional entre la «cadena Base64 pura» i el «DataURL complet» — tant afegint automàticament el prefix data: i el tipus MIME a un Base64 existent, com extraient només la part Base64 pura d'un DataURL.

**Usos típics:** ① incrustar imatges de fons en CSS; ② src en línia a HTML <img>; ③ imatges en línia a Markdown; ④ enganxar imatges a editors de text enriquit; ⑤ depurar l'esquema data URI.

Casos d'ús

  • Afegir el prefix data: i el tipus MIME a un Base64 existent per obtenir un DataURL que es pugui incrustar directament a HTML
  • Extreure només la part Base64 pura d'un DataURL existent per facilitar-ne la reagrupació o la transmissió
  • Verificar la integritat de la càrrega útil Base64 en depurar recursos data: al frontend
  • Detectar automàticament el tipus MIME (PNG/JPEG/PDF, etc.) del Base64 que hi ha al porta-retalls
  • Preparar un data URL per a CSS background-image o HTML <img src>
  • Convertir el Base64 d'una imatge en un DataURL que es pugui enganxar a editors de text enriquit de Markdown

Com usar-ho

  1. Trieu el sentit: «Afegeix capçalera» (Base64 pur → DataURL) o «Treu capçalera» (DataURL → Base64 pur).
  2. Enganxeu el contingut al quadre de l'esquerra: en mode afegir, enganxeu el Base64 pur; en mode treure, enganxeu la cadena data:...
  3. En mode afegir podeu mantenir la «Detecció automàtica» o triar un tipus concret al menú desplegable MIME.
  4. L'eina converteix en temps real, el resultat es mostra a la dreta i es pot copiar o descarregar com a txt.

Característiques

  • Conversió bidireccional: Base64 pur ↔ DataURL
  • 11 tipus MIME: imatges, documents, àudio/vídeo, text
  • Detecció automàtica de MIME: bytes màgics per a PNG/JPEG/GIF/WEBP/PDF
  • Eliminació d'espais: neteja automàtica de salts de línia i espais
  • Conversió en temps real: recàlcul automàtic 300 ms després d'escriure
  • Canvi automàtic de sentit: en canviar el sentit, l'entrada i la sortida s'intercanvien automàticament
  • Copia amb un sol clic: el resultat es copia al porta-retalls immediatament
  • Descàrrega a txt: desa el fitxer dataurl-result.txt
  • Compatible amb PC i mòbil: panell divisió arrossegable o commutació de pestanyes
  • Processament local al navegador: el contingut no s'envia al servidor

Best Practices

Primer feu servir la detecció automàtica

si no esteu segurs del tipus MIME, deixeu activa la «Detecció automàtica» per defecte i trieu manualment només si la detecció falla.

Tingueu en compte el límit de mida

el DataURL té un límit d'uns 2–4 MB al navegador; per a fitxers grans és millor fer servir una referència URL que incrustar-los.

Eliminació de caràcters sobrers

el Base64 que s'enganxa sovint porta salts de línia; l'eina els elimina automàticament. Si necessiteu més rigor, utilitzeu primer la «Neteja Base64».

Verificació comparativa

després de la conversió, useu la «Validació Base64» o les eines de desenvolupador del navegador per comprovar que el DataURL es carrega correctament.

Comprovació després de copiar

un cop enganxat al lloc de destinació, verifiqueu a la consola del navegador que el resultat de la descodificació coincideixi amb el que esperàveu.

Preguntes freqients

El mode d'afegir ja porta la detecció automàtica activada?

Sí. Aquesta eina activa la detecció automàtica per defecte: examina els primers bytes del Base64 (bytes màgics) per determinar si és PNG, JPEG, GIF, WEBP o PDF. Si necessiteu un altre tipus MIME (p. ex. application/json, video/mp4), el podeu triar manualment al menú desplegable.

Què passa si l'entrada ja porta el prefix data:?

En mode afegir, si l'entrada ja comença per data:, l'eina la retorna tal qual i no hi afegeix el prefix de nou. En mode treure, si l'entrada no té el format DataURL, l'eina n'elimina els espais i retorna el Base64 pur.

Què passa si la detecció automàtica falla?

Si el Base64 no coincideix amb cap dels bytes màgics de PNG/JPEG/GIF/WEBP/PDF, la detecció automàtica torna a application/octet-stream. En aquest cas es recomana triar manualment el tipus MIME adequat.

Quins tipus MIME s'admeten?

image/png, image/jpeg, image/gif, image/webp, image/svg+xml, application/pdf, application/json, text/plain, text/html, audio/mpeg, video/mp4 — en total 11 tipus habituals.

Hi ha un límit de mida per al DataURL al navegador?

Sí. La majoria de navegadors limiten la longitud total del DataURL (aproximadament 2–4 MB, segons el navegador); si se supera, el recursos no es carregarà. Per a fitxers grans, es recomana fer servir una referència URL normal.

On es poden utilitzar els DataURL?

A l'atribut <img src> de l'HTML, a url() del CSS, a <a href> per descarregar, a fetch de JavaScript, a la sintaxi d'imatges del Markdown, a recursos incrustats en dades JSON, etc.

S'eliminen automàticament els salts de línia i els espais del Base64?

Sí. En mode afegir s'eliminen els salts de línia i els espais abans d'afegir el prefix; en mode treure també s'eliminen els espais després d'extreure'ls del DataURL.

En canviar el sentit, canvia l'entrada?

En canviar el sentit, l'eina posa automàticament la sortida actual com a nova entrada, cosa que facilita les operacions consecutives.

El contingut s'envia al servidor?

No. Totes les conversions es fan localment al navegador; ni l'entrada ni la sortida surten del vostre dispositiu.

Glossari

DataURL
Esquema URI de dades definit per RFC 2397, format data:[<mime>];base64,<data>, es pot utilitzar directament com a valor de src, href, url(), etc.
Tipus MIME
Identificador de tipus de mitjà, com image/png, application/pdf. Aquesta eina admet 11 tipus MIME habituals i pot detectar-los automàticament.
Bytes màgics
Bytes fixos a l'inici del fitxer que serveixen per identificar-ne el tipus. L'eina detecta PNG/JPEG/GIF/WEBP/PDF, entre d'altres, mitjançant bytes màgics.
Base64
Mètode de codificació que representa dades binàries amb 64 caràcters imprimibles. La càrrega útil del DataURL és Base64.
Esquema Data URI
Protocol URI data: definit per RFC 2397 — el nom oficial de l'especificació DataURL.

Authoritative References