1. IronPDF
  2. Guides pratiques
  3. DataUris et intégration d'images
Comment intégrer des images avec des URI de données en C# | IronPDF

Embed images with DataURIs in C# ; & VB PDF Rendering (en anglais)

Curtis Chau
Curtis Chau
Mis à jour:
This article was translated from English: Does it need improvement?
Translated
View the article in English

Incorporez des images directement dans des documents PDF à l'aide de DataURIs en C# et VB.NET avec IronPDF, en éliminant les dépendances de fichiers externes en convertissant les octets d'image en chaînes base64 et en les incluant en ligne dans le balisage HTML pour un rendu PDF transparent.

Lorsque l'on travaille avec des chaînes et des documents HTML, il est souvent essentiel d'éviter les dépendances avec les répertoires d'actifs. Le schéma data URI constitue une solution efficace.

Le schéma URI de données incorpore les données directement dans le code HTML ou CSS, éliminant ainsi le besoin de fichiers séparés. les DataURIs permettent d'injecter des images, des fichiers et des caractères directement dans un document HTML sous la forme d'une chaîne.

Démarrage rapide : Intégrer des images dans des PDFs en utilisant des DataURIs

Transformez du contenu HTML en documents PDF en intégrant des images à l'aide de DataURIs avec IronPDF. Ce guide montre comment rendre des PDF avec des images intégrées en utilisant un code simple et efficace. IronPDF convertit HTML en PDF tout en préservant l'intégrité de l'image. Voici un exemple simple montrant comment intégrer une image directement dans votre document PDF à l'aide de DataURI avec un minimum de code.

Nuget IconCommencez dès maintenant à créer des PDF avec NuGet :

  1. Installez IronPDF avec le gestionnaire de packages NuGet

    PM > Install-Package IronPdf

  2. Copiez et exécutez cet extrait de code.

    new IronPdf.ChromePdfRenderer.StaticRenderHtmlAsPdf("<img src='data:image/png;base64,...' />").SaveAs("output.pdf");

  3. Déployez pour tester sur votre environnement de production.

    Commencez à utiliser IronPDF dans votre projet dès aujourd'hui grâce à un essai gratuit.
    arrow pointer

Flux de travail minimal (5 étapes)

  1. Télécharger IronPDF depuis NuGet
  2. Lire les octets de l'image à l'aide de la méthode ReadAllBytes
  3. Utilisez la méthode ToBase64String pour convertir des octets en base64
  4. Inclure les informations base64 dans la balise img
  5. Transformation du HTML en PDF


Comment intégrer des images dans des PDF à l'aide de DataURIs?

<TODO : Ajouter une image ici -->

L'intégration d'images à l'aide de DataURIs inclut les images directement dans le balisage HTML sans faire référence à des fichiers externes. Cette approche fonctionne bien lorsque l'on génère des PDF dans des environnements en nuage, des systèmes distribués ou lorsque l'on s'assure que toutes les ressources sont autonomes. La conversion HTML vers PDF d'IronPdf prend entièrement en charge les DataURIs, ce qui permet de créer des PDF professionnels avec des images intégrées.

Le processus comporte trois étapes : lecture des données de l'image, conversion au format base64 et intégration dans une balise HTML img. Cette méthode fonctionne avec différents formats d'image, notamment PNG, JPEG, GIF et SVG, ce qui offre une grande souplesse dans les flux de production de PDF. La technique reste cohérente, que l'on travaille avec des images Azure Blob Storage ou des fichiers locaux.

Exemple basique d'intégration d'image

<TODO : Ajouter une image ici -->

Cet exemple complet montre comment intégrer une image dans un PDF à l'aide de DataURIs :

:path=/static-assets/pdf/content-code-examples/how-to/datauris-image.cs
using IronPdf;
using System;

// Read byte from image file
var pngBinaryData = System.IO.File.ReadAllBytes("My_image.png");

// Convert bytes to base64
var ImgDataURI = @"data:image/png;base64," + Convert.ToBase64String(pngBinaryData);

// Import base64 to img tag
var ImgHtml = $"<img src='{ImgDataURI}'>";

ChromePdfRenderer Renderer = new ChromePdfRenderer();

// Render the HTML string
var pdf = Renderer.RenderHtmlAsPdf(ImgHtml);

pdf.SaveAs("datauri_example.pdf");
$vbLabelText   $csharpLabel

Les développeurs VB.NET peuvent réaliser la même fonctionnalité en utilisant la bibliothèque VB.NET PDF d'IronPDF :

Imports IronPdf
Imports System

' Read byte from image file
Dim pngBinaryData As Byte() = System.IO.File.ReadAllBytes("My_image.png")

' Convert bytes to base64
Dim ImgDataURI As String = "data:image/png;base64," & Convert.ToBase64String(pngBinaryData)

' Import base64 to img tag
Dim ImgHtml As String = $"<img src='{ImgDataURI}'>"

Dim Renderer As New ChromePdfRenderer()

' Render the HTML string
Dim pdf = Renderer.RenderHtmlAsPdf(ImgHtml)

pdf.SaveAs("datauri_example.pdf")
Imports IronPdf
Imports System

' Read byte from image file
Dim pngBinaryData As Byte() = System.IO.File.ReadAllBytes("My_image.png")

' Convert bytes to base64
Dim ImgDataURI As String = "data:image/png;base64," & Convert.ToBase64String(pngBinaryData)

' Import base64 to img tag
Dim ImgHtml As String = $"<img src='{ImgDataURI}'>"

Dim Renderer As New ChromePdfRenderer()

' Render the HTML string
Dim pdf = Renderer.RenderHtmlAsPdf(ImgHtml)

pdf.SaveAs("datauri_example.pdf")
VB .NET

Pourquoi utiliser des DataURIs plutôt que des références de fichiers?

les DataURIs offrent plusieurs avantages par rapport aux références de fichiers traditionnelles lors de la génération de PDF. Tout d'abord, ils éliminent les dépendances vis-à-vis des fichiers externes, ce qui rend la génération de PDF plus fiable et plus portable. Cela est crucial dans les environnements cloud comme Azure ou AWS Lambda où l'accès au système de fichiers peut être limité ou sensible aux performances.

Deuxièmement, les DataURIs garantissent que les PDF sont complètement autonomes. Lors du partage ou de la distribution des PDF générés, les liens d'image brisés ou les ressources manquantes ne sont pas un problème. Les DataURIs sont donc idéaux pour générer des rapports, des factures ou des documents devant être archivés ou distribués par courrier électronique.

Troisièmement, les DataURIs peuvent améliorer les performances dans certains scénarios. Étant donné que les données d'image sont intégrées directement dans le code HTML, aucune requête HTTP ou opération de système de fichiers supplémentaire n'est effectuée pendant le rendu. Cela permet de générer des PDF plus rapidement, en particulier lors de la manipulation de plusieurs petites images.

Quels sont les formats d'image pris en charge ?

IronPDF prend en charge tous les principaux formats d'image par le biais de DataURIs, ce qui offre une grande souplesse dans les flux de travail de génération de PDF :

  • PNG : idéal pour les images transparentes ou les graphiques aux bords tranchants. Utilisez data:image/png;base64,
  • JPEG : idéal pour les photographies et les images complexes comportant de nombreuses couleurs. Utilisez data:image/jpeg;base64,
  • GIF : Convient pour les animations simples ou les images avec peu de couleurs. Utilisez data:image/gif;base64,
  • SVG : Parfait pour les graphiques vectoriels évolutifs. Utilisez data:image/svg+xml;base64,
  • WebP : Format moderne avec une excellente compression. Utilisez data:image/webp;base64,

L'exemple suivant montre comment gérer différents formats d'images :

using IronPdf;
using System;
using System.IO;

public class MultiFormatImageEmbedding
{
    public static void EmbedVariousImageFormats()
    {
        var renderer = new ChromePdfRenderer();

        // Function to create DataURI from image file
        string CreateDataUri(string filePath, string mimeType)
        {
            var imageBytes = File.ReadAllBytes(filePath);
            return $"data:{mimeType};base64,{Convert.ToBase64String(imageBytes)}";
        }

        // Create HTML with multiple image formats
        var html = $@"
        <html>
        <body>
            <h1>Multi-Format Image Test</h1>
            <img src='{CreateDataUri("logo.png", "image/png")}' alt='PNG Logo' />
            <img src='{CreateDataUri("photo.jpg", "image/jpeg")}' alt='JPEG Photo' />
            <img src='{CreateDataUri("icon.svg", "image/svg+xml")}' alt='SVG Icon' />
        </body>
        </html>";

        var pdf = renderer.RenderHtmlAsPdf(html);
        pdf.SaveAs("multi_format_images.pdf");
    }
}
using IronPdf;
using System;
using System.IO;

public class MultiFormatImageEmbedding
{
    public static void EmbedVariousImageFormats()
    {
        var renderer = new ChromePdfRenderer();

        // Function to create DataURI from image file
        string CreateDataUri(string filePath, string mimeType)
        {
            var imageBytes = File.ReadAllBytes(filePath);
            return $"data:{mimeType};base64,{Convert.ToBase64String(imageBytes)}";
        }

        // Create HTML with multiple image formats
        var html = $@"
        <html>
        <body>
            <h1>Multi-Format Image Test</h1>
            <img src='{CreateDataUri("logo.png", "image/png")}' alt='PNG Logo' />
            <img src='{CreateDataUri("photo.jpg", "image/jpeg")}' alt='JPEG Photo' />
            <img src='{CreateDataUri("icon.svg", "image/svg+xml")}' alt='SVG Icon' />
        </body>
        </html>";

        var pdf = renderer.RenderHtmlAsPdf(html);
        pdf.SaveAs("multi_format_images.pdf");
    }
}
$vbLabelText   $csharpLabel

Pour le traitement avancé des images, notamment l'ajout d'images à des PDF existants, IronPDF offre une prise en charge complète.

Comment le codage Base64 affecte-t-il la taille des fichiers ?

<TODO : Ajouter une image ici -->

L'encodage Base64 augmente la taille des données d'environ 33 %. Base64 représente des données binaires en utilisant seulement 64 caractères ASCII, ce qui nécessite 4 caractères pour représenter tous les 3 octets de données originales. Bien que cela augmente la taille globale, l'impact sur la génération de PDF est souvent minime par rapport aux avantages des documents autonomes.

Optimisez la taille des fichiers lorsque vous utilisez des DataURIs en suivant ces pratiques :

  1. Compresser les images avant de les encoder : Utilisez des outils ou des bibliothèques pour optimiser les fichiers images avant de les convertir en base64
  2. Choisissez les formats appropriés : Utilisez le format JPEG pour les photos et le format PNG pour les graphiques transparents
  3. <Redimensionnez les images de manière appropriée : N'intégrez pas d'images plus grandes que nécessaire pour la sortie PDF
  4. <Pensez à la compression des PDF : Utilisez les fonctionnalités de compression d'IronPDF après la génération

Cet exemple montre l'optimisation d'une image avant son intégration :

using IronPdf;
using System;
using System.Drawing;
using System.Drawing.Imaging;
using System.IO;

public class OptimizedImageEmbedding
{
    public static void EmbedOptimizedImage(string imagePath, int maxWidth = 800)
    {
        // Load and resize image if necessary
        using (var originalImage = Image.FromFile(imagePath))
        {
            var resizedImage = originalImage;

            if (originalImage.Width > maxWidth)
            {
                var ratio = (double)maxWidth / originalImage.Width;
                var newHeight = (int)(originalImage.Height * ratio);
                resizedImage = new Bitmap(originalImage, maxWidth, newHeight);
            }

            // Convert to optimized JPEG
            using (var ms = new MemoryStream())
            {
                var encoder = ImageCodecInfo.GetImageEncoders()
                    .First(c => c.FormatID == ImageFormat.Jpeg.Guid);
                var encoderParams = new EncoderParameters(1);
                encoderParams.Param[0] = new EncoderParameter(
                    System.Drawing.Imaging.Encoder.Quality, 85L);

                resizedImage.Save(ms, encoder, encoderParams);
                var imageBytes = ms.ToArray();

                // Create DataURI
                var dataUri = $"data:image/jpeg;base64,{Convert.ToBase64String(imageBytes)}";

                // Generate PDF
                var html = $@"
                <html>
                <body>
                    <h1>Optimized Image Example</h1>
                    <img src='{dataUri}' style='max-width: 100%;' />
                </body>
                </html>";

                var renderer = new ChromePdfRenderer();
                var pdf = renderer.RenderHtmlAsPdf(html);
                pdf.SaveAs("optimized_image.pdf");
            }

            if (resizedImage != originalImage)
                resizedImage.Dispose();
        }
    }
}
using IronPdf;
using System;
using System.Drawing;
using System.Drawing.Imaging;
using System.IO;

public class OptimizedImageEmbedding
{
    public static void EmbedOptimizedImage(string imagePath, int maxWidth = 800)
    {
        // Load and resize image if necessary
        using (var originalImage = Image.FromFile(imagePath))
        {
            var resizedImage = originalImage;

            if (originalImage.Width > maxWidth)
            {
                var ratio = (double)maxWidth / originalImage.Width;
                var newHeight = (int)(originalImage.Height * ratio);
                resizedImage = new Bitmap(originalImage, maxWidth, newHeight);
            }

            // Convert to optimized JPEG
            using (var ms = new MemoryStream())
            {
                var encoder = ImageCodecInfo.GetImageEncoders()
                    .First(c => c.FormatID == ImageFormat.Jpeg.Guid);
                var encoderParams = new EncoderParameters(1);
                encoderParams.Param[0] = new EncoderParameter(
                    System.Drawing.Imaging.Encoder.Quality, 85L);

                resizedImage.Save(ms, encoder, encoderParams);
                var imageBytes = ms.ToArray();

                // Create DataURI
                var dataUri = $"data:image/jpeg;base64,{Convert.ToBase64String(imageBytes)}";

                // Generate PDF
                var html = $@"
                <html>
                <body>
                    <h1>Optimized Image Example</h1>
                    <img src='{dataUri}' style='max-width: 100%;' />
                </body>
                </html>";

                var renderer = new ChromePdfRenderer();
                var pdf = renderer.RenderHtmlAsPdf(html);
                pdf.SaveAs("optimized_image.pdf");
            }

            if (resizedImage != originalImage)
                resizedImage.Dispose();
        }
    }
}
$vbLabelText   $csharpLabel

Techniques avancées et meilleures pratiques

Lorsque vous travaillez avec des DataURIs dans des environnements de production, mettez en place des mécanismes de mise en cache pour éviter d'encoder plusieurs fois les mêmes images. Ceci est particulièrement important lors de la génération de plusieurs PDF avec des ressources partagées. Exploitez les capacités async d'IronPDF pour de meilleures performances lors du traitement de plusieurs images.

Pour les documents complexes comportant de nombreuses images, utilisez une approche hybride dans laquelle les images essentielles sont intégrées sous forme de DataURI tandis que les images plus grandes et facultatives sont référencées à l'extérieur. Il s'agit de trouver un équilibre entre des documents autonomes et des fichiers de taille raisonnable.

Vous pouvez également servir l'intégralité d'une chaîne HTML ou d'un document PDF sous la forme d'un tableau d'octets à l'aide de l'intégration ASP.NET MVC d'IronPDF. Cette technique fonctionne bien lors de la création d'applications web qui génèrent et servent des PDF de manière dynamique.

Pour les techniques avancées de manipulation des PDF, notamment le filigrane, les signatures numériques et la création de formulaires, IronPDF fournit une documentation complète et des exemples permettant de construire des solutions PDF robustes.

Questions Fréquemment Posées

Que sont les DataURI et pourquoi les utiliser pour la génération de PDF ?

Les DataURI sont un système qui incorpore des données directement dans le code HTML ou CSS sous forme de chaînes codées en base64, ce qui élimine le besoin de fichiers d'images séparés. IronPDF prend entièrement en charge les DataURI, ce qui les rend idéaux pour les environnements cloud, les systèmes distribués ou lorsque vous avez besoin de PDF autonomes sans dépendances de fichiers externes.

Comment convertir une image au format DataURI pour l'intégrer dans un PDF ?

Avec IronPDF, la conversion d'une image en DataURI se fait en trois étapes : Premièrement, lire les octets de l'image à l'aide de System.IO.File.ReadAllBytes(). Ensuite, convertir les octets en base64 à l'aide de Convert.ToBase64String(). Enfin, intégrez la chaîne base64 dans une balise HTML img au format "data:image/png;base64,[base64string]".

Quels sont les formats d'image pris en charge lors de l'intégration d'images en tant que DataURI ?

IronPDF prend en charge l'intégration de divers formats d'image en tant que DataURI, notamment PNG, JPEG, GIF et SVG. Cette flexibilité vous permet de travailler avec différents types d'images tout en gardant un contrôle total sur le flux de travail de la génération de PDF.

Puis-je intégrer plusieurs images à l'aide de DataURI dans un seul PDF ?

Oui, IronPDF vous permet d'intégrer plusieurs images à l'aide de DataURI dans un seul document PDF. Il suffit de convertir chaque image en sa représentation base64 et de les inclure dans votre balisage HTML avant le rendu avec le ChromePdfRenderer d'IronPDF.

L'utilisation de DataURI au lieu de références de fichiers a-t-elle un impact sur les performances ?

Alors que les DataURI augmentent la taille de la chaîne HTML en raison de l'encodage base64, IronPDF gère la conversion de manière efficace. Le compromis en vaut la peine lorsque vous avez besoin de PDF autonomes sans dépendances externes, en particulier dans les environnements cloud ou distribués.

Curtis Chau
Curtis Chau
  Discutez maintenant avec l'équipe d'ingénierie
Rédacteur technique

Curtis Chau détient un baccalauréat en informatique (Université de Carleton) et se spécialise dans le développement front-end avec expertise en Node.js, TypeScript, JavaScript et React. Passionné par la création d'interfaces utilisateur intuitives et esthétiquement plaisantes, Curtis aime travailler avec des frameworks modernes ...

Lire la suite
Prêt à commencer?
Nuget Téléchargements 17,012,929 | Version : 2025.12 vient de sortir