Export Document Images to HTML

• May 06, 2022
• 3 minutes to read

When you save a document as HTML, you can export images within the document as follows:

• Embed images into an HTML file as Base64-encoded data.

  HTML

  <img src="data:image/png;base64,,iVBORw0KGgoAAAANSUhEUgAAAQQAAA<!-- base64 data -->" width="260" height="90" alt="" style="border-width:0px;" />
  

• Save images as separate files. Each image is named with the word “image” followed by the image’s sequential number in the document. Images are saved to a folder with the name that combines the file name, an underscore, and the word “files”. For example, the first PNG image in a Test.html file is saved to Test_files\image0.png.

  HTML

  <img src="test_files/image0.png" alt="" style="border-width:0px;" />
  

Different HTML export methods produce different results, as shown in the following table:

Export	Result
RichEditControl.HtmlText property	Images are stored in the resulting HTML file as Base64-encoded data.
SubDocument.GetHtmlText method	The HtmlDocumentExporterOptions.EmbedImages option specifies whether to embed images in the HTML file or save them as separate files. The method’s provider parameter allows you to specify custom URIs for images and CSS data.
RichEditControl.SaveDocument method	The RichEditControl.Options.Export.Html property determines whether images are embedded in the HTML document or saved as separate files.

The HTML exporter uses a URI provider to create a URI for each image. The Rich Text Editor uses the following built-in URI providers:

• FileBasedUriProvider - generates URIs for external images and style sheets;

• DataStringUriProvider - embeds images as Base64-encoded data.

The built-in URI provider service (a service that implements the IUriProviderService interface) calls these providers when needed and allows you to register a custom provider (see the IUriProviderService.RegisterProvider method).

Retain an Image URI in an HTML Document

The example below implements and registers a custom IUriProvider to save the original image URI (OfficeImage.Uri) to the exported HTML document.

View Example

CustomUriProvider.cs

using DevExpress.Office.Services;
using DevExpress.Office.Utils;
using System;
    public class CustomUriProvider : IUriProvider {
        public string CreateCssUri(string rootUri, string styleText, string relativeUri) {
            return String.Empty;
        }

        public string CreateImageUri(string rootUri, OfficeImage image, string relativeUri) {
            return image.Uri;
        }
    }

CustomUriProvider.vb

Imports DevExpress.Office.Services
Imports DevExpress.Office.Utils
    Public Class CustomUriProvider
        Implements IUriProvider

        Public Function CreateCssUri(ByVal rootUri As String, ByVal styleText As String, ByVal relativeUri As String) As String Implements IUriProvider.CreateCssUri
            Return String.Empty
        End Function

        Public Function CreateImageUri(ByVal rootUri As String, ByVal image As OfficeImage, ByVal relativeUri As String) As String Implements IUriProvider.CreateImageUri
            Return image.Uri
        End Function
    End Class

Form1.cs

using System;
using System.Windows.Forms;
using DevExpress.Office.Services;
using DevExpress.XtraRichEdit.API.Native;
        private void richEditControl1_DocumentLoaded(object sender, EventArgs e)
        {
            IUriProviderService service = richEditControl1.GetService<IUriProviderService>();
            if (service != null) {
                service.RegisterProvider(new CustomUriProvider());
            }
        }

Form1.vb

Imports System
Imports System.Windows.Forms
Imports DevExpress.Office.Services
Imports DevExpress.XtraRichEdit.API.Native
        Private Sub richEditControl1_DocumentLoaded(ByVal sender As Object, ByVal e As EventArgs) Handles richEditControl1.DocumentLoaded
            Dim service As IUriProviderService = richEditControl1.GetService(Of IUriProviderService)()
            If service IsNot Nothing Then
                service.RegisterProvider(New CustomUriProvider())
            End If
        End Sub