1. IronPDF
  2. Anleitungen
  3. DataUris und Bilder-Einbettung
Wie man Bilder mit Daten-URIs in C# | IronPDF einbettet

Bilder einbetten mit DataURIs in C# & VB PDF Rendering

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

Mit IronPDF können Sie Bilder direkt in PDF-Dokumente einbetten, indem Sie DataURIs in C# und VB.NET verwenden. Durch die Konvertierung von Bild-Bytes in base64-Strings und deren Einbindung in HTML-Markup für eine nahtlose PDF-Darstellung werden externe Dateiabhängigkeiten eliminiert.

Bei der Arbeit mit HTML-Strings und -Dokumenten ist die Vermeidung von Abhängigkeiten von Asset-Verzeichnissen oft unerlässlich. Das Daten-URI-Schema bietet eine effektive Lösung.

Das Daten-URI-Schema bettet die Daten direkt in den HTML- oder CSS-Code ein, sodass keine separaten Dateien erforderlich sind. mit DataURIs können Bilder, Dateien und Schriftarten direkt als String in ein HTML-Dokument eingefügt werden.

als-Überschrift:2(Schnellstart: Bilder in PDFs mit DataURIs einfügen)

Umwandlung von HTML-Inhalten in PDF-Dokumente durch Einbettung von Bildern mithilfe von DataURIs mit IronPDF. Dieser Leitfaden zeigt, wie man PDFs mit eingebetteten Bildern mit einfachem, effizientem Code rendert. IronPDF konvertiert HTML in PDF, wobei die Bildintegrität erhalten bleibt. Hier ist ein einfaches Beispiel, das zeigt, wie man ein Bild mit DataURI mit minimalem Code direkt in ein PDF-Dokument einbettet.

Nuget IconLegen Sie jetzt mit NuGet los, um PDFs zu erstellen:

  1. Installieren Sie IronPDF mit dem NuGet-Paketmanager.

    PM > Install-Package IronPdf

  2. Kopieren Sie diesen Codeausschnitt und führen Sie ihn aus.

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

  3. Bereitstellen zum Testen in Ihrer Live-Umgebung

    Beginnen Sie noch heute mit der Nutzung von IronPDF in Ihrem Projekt – mit einer kostenlosen Testversion.
    arrow pointer

Minimaler Arbeitsablauf (5 Schritte)

  1. IronPDF von NuGet herunterladen
  2. Lesen Sie die Bildbytes mit der Methode ReadAllBytes
  3. Verwenden Sie die Methode ToBase64String, um Bytes in base64 zu konvertieren
  4. Fügen Sie die base64-Informationen in das img-Tag ein
  5. Rendering des HTML in PDF


Wie kann ich Bilder mit DataURIs in PDFs einbetten?

Beim Einbetten von Bildern mit DataURIs werden Bilder direkt in HTML-Auszeichnungen eingefügt, ohne auf externe Dateien zu verweisen. Dieser Ansatz eignet sich gut für die Erstellung von PDFs in Cloud-Umgebungen, verteilten Systemen oder wenn sichergestellt werden soll, dass alle Ressourcen in sich geschlossen sind. IronPDFs HTML-zu-PDF-Konvertierung unterstützt vollständig DataURIs und ermöglicht die professionelle Erstellung von PDF-Dateien mit eingebetteten Bildern.

Der Prozess umfasst drei Schritte: Lesen der Bilddaten, Konvertieren in das base64-Format und Einbetten in ein HTML-img-Tag. Diese Methode funktioniert mit verschiedenen Bildformaten, darunter PNG, JPEG, GIF und SVG, und bietet Flexibilität bei der PDF-Erstellung. Die Technik bleibt gleich, egal ob mit Azure Blob Storage Images oder lokalen Dateien gearbeitet wird.

Basic Image Embedding Example

Dieses vollständige Beispiel zeigt, wie ein Bild mithilfe von DataURIs in eine PDF-Datei eingebettet werden kann:

: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

VB.NET-Entwickler können die gleiche Funktionalität mit der VB.NET-PDF-Bibliothek von IronPDF erreichen:

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

Warum sollte ich DataURIs anstelle von Dateiverweisen verwenden?

DataURIs bieten mehrere Vorteile gegenüber herkömmlichen Dateireferenzen bei der Erstellung von PDFs. Erstens beseitigen sie Abhängigkeiten von externen Dateien und machen die PDF-Erstellung zuverlässiger und portabler. Dies ist besonders wichtig in Cloud-Umgebungen wie Azure oder AWS Lambda, wo der Zugriff auf das Dateisystem begrenzt oder leistungsabhängig sein kann.

Zweitens sorgen DataURIs dafür, dass die PDFs vollständig in sich geschlossen sind. Bei der Weitergabe oder Verteilung der generierten PDFs sind defekte Bildlinks oder fehlende Ressourcen kein Problem. Damit ist DataURIs ideal für die Erstellung von Berichten, Rechnungen oder Dokumenten, die archiviert oder per E-Mail verschickt werden müssen.

Drittens: DataURIs können in bestimmten Szenarien die Leistung verbessern. Da die Bilddaten direkt in HTML eingebettet sind, fallen beim Rendern keine zusätzlichen HTTP-Anfragen oder Dateisystemoperationen an. Dies führt zu einer schnelleren PDF-Erzeugung, insbesondere bei der Bearbeitung mehrerer kleiner Bilder.

Welche Bildformate werden unterstützt?

IronPDF unterstützt alle wichtigen Bildformate über DataURIs und bietet damit Flexibilität in den Arbeitsabläufen der PDF-Generierung:

  • PNG: Ideal für Bilder mit Transparenz oder Grafiken mit scharfen Kanten. Verwenden Sie data:image/png;base64,
  • JPEG: Am besten geeignet für Fotos und komplexe Bilder mit vielen Farben. Verwenden Sie data:image/jpeg;base64,
  • GIF: Geeignet für einfache Animationen oder Bilder mit wenigen Farben. Verwenden Sie data:image/gif;base64,
  • SVG: Perfekt für skalierbare Vektorgrafiken. Verwenden Sie data:image/svg+xml;base64,
  • WebP: Modernes Format mit hervorragender Komprimierung. Verwenden Sie data:image/webp;base64,

Das folgende Beispiel zeigt, wie man mit verschiedenen Bildformaten umgeht:

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

IronPDF bietet umfassende Unterstützung für fortgeschrittene Bildbearbeitung, einschließlich Hinzufügen von Bildern zu bestehenden PDFs.

Wie wirkt sich die Base64-Kodierung auf die Dateigröße aus?

Die Base64-Kodierung erhöht die Datengröße um etwa 33 %. Base64 stellt binäre Daten mit nur 64 ASCII-Zeichen dar, wobei 4 Zeichen für jeweils 3 Bytes der Originaldaten benötigt werden. Dadurch erhöht sich zwar der Gesamtumfang, aber die Auswirkungen auf die PDF-Erstellung sind im Vergleich zu den Vorteilen von in sich geschlossenen Dokumenten oft minimal.

Optimieren Sie die Dateigrößen bei der Verwendung von DataURIs, indem Sie diese Praktiken befolgen:

  1. Bilder vor der Kodierung komprimieren: Verwenden Sie Tools oder Bibliotheken, um Bilddateien vor der Konvertierung in base64 zu optimieren
  2. Wählen Sie geeignete Formate: Verwenden Sie JPEG für Fotos, PNG für Grafiken mit Transparenz
  3. Bilder in angemessener Größe anpassen: Betten Sie keine Bilder ein, die größer sind als für die PDF-Ausgabe erforderlich
  4. Komprimierung von PDF-Dateien in Betracht ziehen: Verwenden Sie die Komprimierungsfunktionen von IronPDF nach der Erstellung

Dieses Beispiel demonstriert die Bildoptimierung vor dem Einbetten:

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

Fortgeschrittene Techniken und bewährte Praktiken

Wenn Sie mit DataURIs in Produktionsumgebungen arbeiten, implementieren Sie Caching-Mechanismen, um zu vermeiden, dass dieselben Bilder wiederholt kodiert werden. Dies ist besonders wichtig, wenn mehrere PDFs mit gemeinsamen Ressourcen erstellt werden. Nutzen Sie die async-Funktionen von IronPDF für eine bessere Leistung bei der Verarbeitung mehrerer Bilder.

Bei komplexen Dokumenten mit vielen Bildern sollten Sie einen hybriden Ansatz wählen, bei dem wichtige Bilder als DataURIs eingebettet werden, während größere, optionale Bilder extern referenziert werden. Dabei werden in sich geschlossene Dokumente mit angemessenen Dateigrößen berücksichtigt.

Mit der ASP.NET MVC-Integration von IronPDF können Sie auch einen ganzen HTML-String oder ein PDF-Dokument als Byte-Array bereitstellen. Diese Technik eignet sich gut für die Erstellung von Webanwendungen, die PDFs dynamisch erzeugen und bereitstellen.

Für fortgeschrittene PDF-Manipulationstechniken, einschließlich Wasserzeichen, digitale Signaturen und Formularerstellung, bietet IronPDF eine umfassende Dokumentation und Beispiele für die Erstellung robuster PDF-Lösungen.

Häufig gestellte Fragen

Was sind DataURIs und warum sollte man sie für die PDF-Erstellung verwenden?

DataURIs sind ein Schema, mit dem Daten direkt in HTML- oder CSS-Code als base64-kodierte Strings eingebettet werden, sodass keine separaten Bilddateien erforderlich sind. IronPDF unterstützt DataURIs in vollem Umfang und ist damit ideal für Cloud-Umgebungen, verteilte Systeme oder wenn Sie in sich geschlossene PDFs ohne externe Dateiabhängigkeiten benötigen.

Wie konvertiere ich ein Bild in ein DataURI-Format für die PDF-Einbettung?

Mit IronPDF umfasst die Konvertierung eines Bildes in DataURI drei Schritte: Erstens: Lesen der Bildbytes mit System.IO.File.ReadAllBytes(). Zweitens werden die Bytes mit Convert.ToBase64String() in base64 konvertiert. Schließlich wird der base64-String in ein HTML-img-Tag mit dem Format 'data:image/png;base64,[base64string]' eingebettet.

Welche Bildformate werden beim Einbetten von Bildern als DataURIs unterstützt?

IronPDF unterstützt die Einbettung verschiedener Bildformate als DataURIs, einschließlich PNG, JPEG, GIF und SVG. Diese Flexibilität ermöglicht es Ihnen, mit verschiedenen Bildtypen zu arbeiten und gleichzeitig die volle Kontrolle über den PDF-Generierungsworkflow zu behalten.

Kann ich mehrere Bilder mit DataURIs in eine einzige PDF-Datei einbetten?

Ja, IronPDF ermöglicht das Einbetten mehrerer Bilder mithilfe von DataURIs in ein einzelnes PDF-Dokument. Konvertieren Sie einfach jedes Bild in seine base64-Darstellung und fügen Sie es in Ihr HTML-Markup ein, bevor Sie es mit dem ChromePdfRenderer von IronPDF rendern.

Hat die Verwendung von DataURIs anstelle von Dateiverweisen Auswirkungen auf die Leistung?

Während DataURIs die Größe der HTML-Zeichenfolge aufgrund der base64-Kodierung erhöht, wickelt IronPDF die Konvertierung effizient ab. Der Kompromiss lohnt sich, wenn Sie in sich geschlossene PDFs ohne externe Abhängigkeiten benötigen, insbesondere in Cloud- oder verteilten Umgebungen.

Curtis Chau
Curtis Chau
  Jetzt mit dem Ingenieurteam chatten
Technischer Autor

Curtis Chau hat einen Bachelor-Abschluss in Informatik von der Carleton University und ist spezialisiert auf Frontend-Entwicklung mit Expertise in Node.js, TypeScript, JavaScript und React. Leidenschaftlich widmet er sich der Erstellung intuitiver und ästhetisch ansprechender Benutzerschnittstellen und arbeitet gerne mit modernen Frameworks sowie der Erstellung gut strukturierter, optisch ansprechender ...

Weiterlesen
Bereit anzufangen?
Nuget Downloads 17,012,929 | Version: 2025.12 gerade veröffentlicht