¿Por qué extraer imágenes de HTML? (Beneficios y casos de uso)

HTML los archivos a menudo incluyen varios tipos de imágenes, tales como: imágenes estándar de la etiqueta <img>, imágenes en línea Base64 (data:image/...), imágenes definidas en CSS (por ejemplo, background-image), SVG iconos y gráficos, imágenes vinculadas externamente o recursos de imágenes incrustadas. Extraer imágenes de documentos HTML es útil para:

  • Migración de contenido
  • Extrayendo medios de correos electrónicos HTML
  • Raspado de web y análisis
  • Preparando conjuntos de datos de entrenamiento para el aprendizaje automático.
  • Convirtiendo HTML en PDF/Word mientras se preservan los medios
  • Archivando páginas web con activos originales

API de procesamiento HTML

GroupDocs.Parser Cloud SDK for .NET es una robusta API basada en REST capaz de procesar todos los formatos de archivo populares, incluidos los archivos HTML. Te permite manipular archivos HTML y puedes usarlo para:

  • Analizar documentos HTML
  • Extraer imágenes incrustadas y en línea
  • Extraer imágenes codificadas en Base64
  • Detectar referencias de imágenes externas
  • Recuperar metadatos (tamaño, tipo, ruta)
  • Descargar imágenes extraídas localmente
  • Automatizar flujos de trabajo de análisis HTML

Formatos de imagen compatibles

Requisitos previos

  • Una cuenta de GroupDocs Cloud (ID de cliente y secreto de cliente).
  • .NET 6.0+ instalado.
  • Visual Studio o un IDE compatible.
  • Paquete NuGet: GroupDocs.Parser-Cloud

Instalar a través de NuGet

dotnet add package GroupDocs.Parser-Cloud --version 25.7.0

Extraer imágenes de HTML usando C#

A continuación se muestra un ejemplo completo de C# que demuestra la extracción de imágenes HTML utilizando la API de Cloud.

Paso 1 — Inicializar la API:

var config = new Configuration("YOUR_CLIENT_ID", "YOUR_CLIENT_SECRET");
var parserApi = new ParserApi(config);
var fileApi = new FileApi(config);

Paso 2 — Proporcione información del archivo HTML para el análisis:

var fileInfo = new FileInfo { FilePath = "input.html" };
var options = new ImagesOptions { FileInfo = fileInfo };
var request = new ImagesRequest(options);

Paso 3 — Extraer Imágenes de HTML (Incrustadas, En línea y Base64):

var response = parserApi.Images(request);

foreach (var image in response.Images)
{
    Console.WriteLine($"Source: {image.Path}, Type: {image.MediaType}, Size: {image.Size}");
}

Paso 4 — Descargar Imágenes Extraídas (Compatible con macOS y Windows):

var outputDirectory = "/Users/nayyer/Downloads/html-images";
Directory.CreateDirectory(outputDirectory);

foreach (var img in response.Images)
{
    var cloudImagePath = img.Path.Replace("\\", "/");

    var downloadRequest = new DownloadFileRequest(path: cloudImagePath);
    using (var stream = fileApi.DownloadFile(downloadRequest))
    {
        var localPath = Path.Combine(outputDirectory, Path.GetFileName(cloudImagePath));

        using (var fileStream = File.Create(localPath))
        {
            stream.CopyTo(fileStream);
        }

        Console.WriteLine($"Downloaded: {localPath}");
    }
}

// Para más ejemplos, por favor visita https://github.com/groupdocs-parser-cloud/groupdocs-parser-cloud-dotnet

var configuration = new Configuration("XXXXXXX-XXXXXXX-XXXXXX-XXXXXX", "XXXXXXXXXXXX");
configuration.ApiBaseUrl = "https://api.groupdocs.cloud";

var parserApi = new ParserApi(config);
var fileApi = new FileApi(config);

var fileInfo = new FileInfo { FilePath = "input.html" };
var options = new ImagesOptions { FileInfo = fileInfo };
var request = new ImagesRequest(options);

var response = parserApi.Images(request);

foreach (var image in response.Images)
{
    Console.WriteLine($"Source: {image.Path}, Type: {image.MediaType}, Size: {image.Size}");
}

var outputDirectory = "/Users/nayyer/Downloads/html-images";
Directory.CreateDirectory(outputDirectory);

foreach (var img in response.Images)
{
    var cloudImagePath = img.Path.Replace("\\", "/");

    var downloadRequest = new DownloadFileRequest(path: cloudImagePath);
    using (var stream = fileApi.DownloadFile(downloadRequest))
    {
        var localPath = Path.Combine(outputDirectory, Path.GetFileName(cloudImagePath));

        using (var fileStream = File.Create(localPath))
        {
            stream.CopyTo(fileStream);
        }

        Console.WriteLine($"Downloaded: {localPath}");
    }
}

Descargar imágenes HTML usando cURL

Aparte del fragmento de código C#, también podemos utilizar comandos cURL para descargar imágenes de archivos HTML.

Paso 1 — Generar Token de Acceso: El primer paso en este enfoque es generar un token de acceso JWT basado en las credenciales del cliente.

curl -v -X POST "https://api.groupdocs.cloud/connect/token" \
-d "grant_type=client_credentials&client_id=YOUR_CLIENT_ID&client_secret=YOUR_CLIENT_SECRET" \
-H "Content-Type: application/x-www-form-urlencoded"

*Step 2 — Extract Images:

curl -v -X POST "https://api.groupdocs.cloud/v1.0/parser/images" \
-H  "accept: application/json" \
-H  "authorization: Bearer {ACCESS_TOKEN}" \
-H  "Content-Type: application/json" \
-d "{ "FileInfo": { "FilePath": "inbox/input.html", "StorageName": "internal" }, "OutputPath": "extracted-images"}"

Pruebe el extractor de imágenes HTML en línea gratuito

Ofrecemos un Extractor de imágenes HTML en línea gratuito desarrollado sobre la API de GroupDocs.Parser Cloud. No se requiere instalación ni descarga de software y evalúe las capacidades de la API REST dentro del navegador web.

extract html images

Conclusión

En este artículo, hemos aprendido la forma más precisa de extraer imágenes de HTML utilizando la API REST de .NET. Con la ayuda de esta API, puedes:

  • Extraer imágenes embebidas y en línea
  • Analizar imágenes codificadas en Base64
  • Extraer imágenes de fondo CSS
  • Recuperar metadatos para imágenes vinculadas
  • Descargar todas las imágenes de manera programática

Por lo tanto, es la mejor solución para automatizar la extracción de medios HTML en aplicaciones C#.

Artículos Relacionados

Recomendamos encarecidamente visitar los siguientes artículos para aprender más sobre:

Preguntas Frecuentes (FAQs)

  1. ¿Puedo extraer imágenes incrustadas en Base64 de HTML? Sí, la API extrae automáticamente imágenes en HTML en línea y codificadas en Base64.

  2. ¿La API extrae imágenes vinculadas externamente? La API extrae metadatos para imágenes vinculadas; descargarlas es opcional.

  3. ¿Puedo extraer imágenes referenciadas en CSS? Sí, las imágenes referenciadas a través de CSS en línea o incrustado son compatibles.

  4. ¿Qué formatos de imagen son compatibles? JPG, PNG, BMP, GIF, TIFF y otros tipos de imagen comunes.

  5. ¿Hay una prueba gratuita? Sí. Puedes crear una cuenta gratuita y obtener 150 llamadas API mensuales gratuitas.