Codificar imágenes en línea

¡Codifique imágenes con Aspose.SVG para .NET API en tiempo real! Cargue una imagen del sistema de archivos local e inmediatamente obtendrá el resultado como URI de datos, fuente de imagen Base64 y fuente de fondo CSS Base64. Se admiten JPG, JPEG, SVG, PJP, PJPEG, PNG, BMP, XBM, GIF, TIFF, ICO, IFIF, WEBP y otros formatos de imagen.

Acerca del esquema URI

URI de datos es un método para incrustar imágenes y otros archivos en páginas web como una cadena de texto basada en la codificación Base64. El esquema de URI de datos le permite incluir cualquier dato binario en documentos HTML, CSS, JSON o SVG. Por ejemplo, puede incrustar imágenes en una página web como si se hubieran cargado desde un recurso externo, pero en lugar de especificar la URL del archivo, inserte el contenido codificado en Base64 de la imagen. El esquema de URI de datos se definió en RFC 2397 y, a partir de 2022, es totalmente compatible con la mayoría de los principales navegadores. La principal ventaja del uso de URI de datos es la aceleración de la carga de la página porque el navegador no necesita realizar una solicitud web adicional para recuperar el archivo, ya que la imagen ya está incrustada en el documento HTML.

La sintaxis del URI de datos es la siguiente: data:[<mime type>][;charset=<charset>][;base64],<encoded data>.

Debido a que el tamaño de los datos codificados en Base64 aumenta en un 33 %, se recomienda usar URI de datos solo para imágenes pequeñas. Las imágenes grandes de Base64 producen una gran cantidad de código en el HTML, lo que resulta en una pérdida de beneficios de rendimiento.


Cómo convertir BMP a Base64 en C#

Para convertir BMP a una cadena Base64, usamos la API Aspose.SVG para .NET, que es una API rica en funciones, potente y fácil de usar. utilice la API de manipulación de documentos para la plataforma C#. Consideramos el ejemplo de codificación BMP a Base64 e incrustación de cadena Base64 como URI de datos en un documento SVG. Estas operaciones se pueden hacer con unas pocas líneas de código:


Código C# para convertir BMP a cadena Base64 e incrustarlo en un archivo SVG

    // Open a binary file - BMP image
    var bytes = File.ReadAllBytes(@"image.bmp");
    // Initialize an SVGDocument object
    var document = new SVGDocument();
    // Create an image element
    var img = (SVGImageElement)document.CreateElementNS("http://www.w3.org/2000/svg", "image");
    // Convert BMP to Base64
    img.Href.BaseVal = "data:image/bmp;charset=utf-8;base64," + Convert.ToBase64String(bytes);
    // Add the image element into the SVG document
    document.RootElement.AppendChild(img);
    // Save the SVG document
    document.Save(@"image-base64.svg");



Pasos para convertir BMP a Base64 en C#

  1. Abra una imagen BMP para convertir. Utilice el método ReadAllBytes(path) para abrir la imagen BMP y leer el contenido del archivo en una matriz de bytes.
  2. Inicialice una nueva instancia de la clase SVGDocument.
  3. Use el método CreateElementNS(namespaceURI,qualifiedName) de la clase SVGDocument para crear un instancia de imagen El namespaceURI establece la referencia a la especificación W3C SVG. El qualifiedName debe contener el nombre de la etiqueta de cadena del elemento de la imagen.
  4. Convierta BMP a Base64. Llame al método ToBase64String(bytes) para convertir una matriz de enteros de 8 bits en su representación de cadena equivalente codificada en dígitos base64.
  5. Agregue el elemento de imagen al documento SVG usando el método AppendChild(node).
  6. Llame al método Save(path) para guardar el documento SVG.

Pros y contras de URI de datos

El URI de datos nos brinda una forma inteligente de incrustar imágenes en una página web. Los esquemas de URI se pueden utilizar de muchas maneras. Pero en cualquier caso, hay pros y contras.

Pros:

  • Acelerar la carga de la página. El navegador no necesita realizar una solicitud web adicional para recuperar el archivo porque la imagen ya está incrustada en el documento HTML.
  • Mejora del rendimiento. El navegador requiere menos tiempo de CPU.
  • Las páginas web se vuelven independientes de los archivos externos, lo que facilita compartirlas incluso sin conexión.

Desventajas:

  • El tamaño de los datos codificados en Base64 es 1/3 más grande que la imagen binaria.
  • El navegador no almacena en caché las imágenes codificadas y se descargarán cada vez que se visite dicha página.
  • Las imágenes codificadas son difíciles de editar porque primero se debe decodificar la cadena Base64.
  • Google nunca indexará una imagen Base64 porque no aparece en los resultados de búsqueda de imágenes.

Codificadores Base64 en línea

Aspose.SVG ofrece aplicaciones en línea gratuitas para codificar y decodificar datos binarios:

  • Codificadores Base64 son un conjunto de herramientas que le permiten codificar datos binarios en varios formatos de salida: Plain Base64, JSON, XML, URI o CSS.
  • Image Base64 Decoder convierte un URI de datos que contiene una cadena Base64 en una imagen pegando una cadena URI en el control de entrada.

Nuestras aplicaciones basadas en navegador funcionan en todas las plataformas, incluidas Windows, Linux, Mac OS, Android e iOS. No se requiere registro, complemento o instalación de software para usted. ¡Comience a usar nuestras herramientas de codificación/descodificación Base64 en línea de manera segura, segura y fácil!

Ejemplos de uso de codificación Base64

Código SVG para incrustar una imagen Base64 BMP en un documento SVG

<svg xmlns="http://www.w3.org/2000/svg">
	<image href="data:image/bmp;charset=utf-8;base64,Qk04DAAAAAAAADYAAAAoAAA..." alt="Blue circle"/>
</svg>

Código HTML para incrustar imagen Base64 BMP

<body>
    <div>
        <img src="data:image/bmp;base64,Qk04DAAAAAAAADYAAAAoAAA..." alt="Blue circle">
    </div>
</body>

Código CSS para incrustar una imagen Base64 BMP como imagen de fondo

.class {
    background-image: url('data:image/bmp;base64,Qk04DAAAAAAAADYAAAAoAAA...');
}

Código XML para incrustar una imagen BMP Base64 en un documento XML

<?xml version="1.0" encoding="UTF-8"?>
<root>
<image mime = "image/bmp">Qk04DAAAAAAAADYAAAAoAAA...</image>
</root>

Código JSON para incrustar una imagen Base64 BMP en un documento JSON

{
  "image": {
    "mime": "image/bmp",
    "data": "Qk04DAAAAAAAADYAAAAoAAA..."
  }
}



Preguntas más frecuentes

1. ¿Cómo puedo convertir BMP a Base64?

Aspose.SVG le permite convertir BMP a una cadena Base64 de cualquier manera, en línea o mediante programación. Por ejemplo, puede codificar BMP en tiempo real usando el Codificador BMP en línea que convierte tus archivos rápidamente y con alta calidad. ¡Cargue, codifique BMP y obtenga el resultado en unos segundos! Por otro lado, puede usar Aspose.SVG para .NET API para convertir BMP a Base64 mediante programación.

2. ¿Por qué se necesita la codificación Base64?

Históricamente, muchos formatos de almacenamiento y transferencia de datos utilizan texto en lugar de código binario (HTML, XML, correo electrónico, etc.). ¿Qué sucede si el formato de transferencia de datos está basado en texto, pero necesita transferir los datos binarios? Aquí es donde entra en juego la codificación Base64. Para evitar la mala interpretación de los símbolos binarios al enviar datos a través de Internet, es necesario codificarlos en caracteres. Algunas aplicaciones típicas de la codificación Base64: esquemas URI de datos para imágenes (CSS, HTML, JavaScript); transferir imágenes y otros datos binarios a XML; almacenar imágenes en una base de datos; incluir imágenes en los mensajes de correo electrónico.

3. ¿Qué navegadores admiten URI de datos?

Data URI es la forma más rápida y sencilla de incrustar imágenes y otros archivos en sus páginas web. El URI de datos es compatible con los principales navegadores modernos: Chrome, Firefox, Safari, Edge, Opera e IE8+.

4. ¿Qué es la codificación Base64?

Base64 es un esquema de codificación de binario a texto que representa datos binarios en un formato de cadena ASCII. La codificación Base64 se usa comúnmente cuando es necesario codificar información binaria que debe almacenarse y transferirse a través de medios diseñados para trabajar con datos de texto.

Comience con la API SVG de .NET

Si está interesado en desarrollar gráficos vectoriales escalables y su aplicación, instale nuestra API Aspose.SVG flexible y de alta velocidad para .NET con un potente conjunto de interfaces para C# y otros lenguajes de programación .NET.
Instale desde la línea de comandos como nuget install Aspose.SVG o a través de Package Manager Console de Visual Studio con Install-Package Aspose.SVG. Alternativamente, obtenga el instalador MSI sin conexión o las DLL en un archivo ZIP desde downloads. Aspose.SVG para .NET API es una biblioteca independiente y no depende de cualquier software para el procesamiento de documentos SVG.
Para obtener más detalles sobre la instalación de la biblioteca de C# y los requisitos del sistema, consulte Documentación de Aspose.SVG.

Otros codificadores Base64 compatibles

Puede convertir la imagen en una cadena Base64. Se admiten los formatos JPG, PNG, BMP, GIF, TIFF, ICO y SVG:

JPG to Base64 (JPEG Image)
PNG to Base64 (Portable Network Graphics)
BMP to Base64 (Bitmap Image)
SVG to Base64 (Scalable Vector Graphics)
TIFF to Base64 (Tagged Image Format)
GIF TO Base64 (Graphical Interchange Format)
ICO to Base64 (Computer Icons Format)
Image to Base64 (Binary Image)