Incrustación de mapas de bits e imágenes
Cuando desees incrustar una imagen en HTML usando codificación base64, necesitarás adquirir los datos binarios de la imagen, ya sea leyendo el archivo de imagen o recibiéndolo a través de una solicitud de red. Como puedes ver, en este ejemplo hemos importado la imagen que queremos usar y adquirido sus datos binarios. Luego, utilizando el método Convert.ToBase64String
, lo hemos convertido exitosamente a base64. A través de este método, podrás agregar tus imágenes a cualquier contenido HTML que estés utilizando para renderizar documentos PDF.
Pasos para incrustar mapas de bits e imágenes
- byte[] pngBinaryData = File.ReadAllBytes("use your image here");
- byte[] base64Bytes = new byte[3];
- string imgDataUri = @"data:image/png;base64," + Convertir.ToBase64String(base64Bytes);
- string imgHtml = $"<img src=''{imgDataUri}''>";
-
PdfDocument pdf = renderer.RenderHtmlAsPdf(imgHtml);
Antes de poder incorporar imágenes en nuestros documentos PDF, primero necesitamos crear una nueva instancia de
ChromePdfRenderer
. Este motor de renderizado es capaz de producir archivos PDF de alta calidad a partir de contenido como cadenas HTML, archivos HTML, URLs y más. Una vez que hemos creado nuestro renderizador, ahora necesitamos cargar la imagen que queremos incrustar. Para hacer esto, necesitarás usar el métodoFile.ReadAllBytes
para leer el contenido del archivo de imagen proporcionado en un arreglo de bytes.A continuación, inicializamos un array de bytes de marcador de posición llamado base64Bytes para representar los datos de la imagen.
Convert.ToBase64String(base64Bytes)
se utiliza luego para convertir el array base64Bytes en una cadena codificada en Base64. A continuación, antepondremos el resultado con un esquema de URI de datos estándar para imágenes PNG, "data:image/png;base64,". Ahora, necesitamos crear la cadena HTML que se utilizará para crear el documento PDF. En esta cadena, hemos creado una etiqueta de imagen, donde el atributosrc
utiliza el URI de datos de la imagen en base64 que creamos en el paso anterior. Esto incrustará nuestra imagen en la cadena HTML y, por lo tanto, en nuestro documento PDF.El siguiente paso es renderizar la cadena HTML a PDF. Para esto, necesitas usar el método
RenderHtmlAsPdf
, al cual se accede a través del renderizador. Al pasar la cadena HTML a través de este método, convertirá el HTML a PDF y almacenará el archivo PDF resultante en el objetoPdfDocument
. Finalmente, puede guardar el PDF renderizado utilizando el métodoSaveAs
. Haga clic aquí para ver la Guía de Cómo Hacer, que incluye ejemplos, código de muestra y archivos.