Почему извлекать изображения из HTML? (Преимущества и случаи использования)

HTML файлы часто включают несколько типов изображений, такие как: стандартные изображения <img>, встроенные изображения Base64 (data:image/...), изображения, определенные в CSS (например, background-image), SVG иконки и графика, внешне подключенные изображения или встроенные ресурсы изображений. Извлечение изображений из HTML-документов полезно для:

  • Миграция контента
  • Извлечение медиа из HTML-емейлов
  • Веб-скрейпинг и анализ
  • Подготовка обучающих наборов данных для машинного обучения
  • Конвертация HTML в PDF/Word с сохранением медиа
  • Архивирование веб-страниц с оригинальными активами

HTML Processing API

GroupDocs.Parser Cloud SDK for .NET — это мощный REST-ориентированный API, способный обрабатывать все популярные форматы файлов, включая HTML-файлы. Он позволяет вам манипулировать HTML-файлами, и вы можете использовать его для:

  • Разберите HTML-документы
  • Извлечение встроенных и блоковых изображений
  • Извлечь изображения, закодированные в Base64
  • Обнаруживать внешние ссылки на изображения.
  • Получить метаданное (размер, тип, путь)
  • Скачайте извлеченные изображения локально
  • Автоматизируйте рабочие процессы парсинга HTML

Поддерживаемые форматы изображений

Предварительные требования

  • Аккаунт GroupDocs Cloud (Идентификатор клиента и Секрет клиента).
  • .NET 6.0+ установлен.
  • Visual Studio или совместимая IDE.
  • NuGet пакет: GroupDocs.Parser-Cloud

Установите через NuGet

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

Извлечение изображений из HTML с использованием C#

Ниже приведен полный пример на C#, демонстрирующий извлечение изображений из HTML с использованием Cloud API.

Шаг 1 — Инициализируйте API:

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

Шаг 2 — Предоставьте информацию о HTML файле для парсинга:

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

Шаг 3 — Извлечение изображений из HTML (встроенные, инлайн и Base64):

var response = parserApi.Images(request);

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

Шаг 4 — Скачайте извлеченные изображения (совместимо с macOS и 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}");
    }
}

// Для дальнейших примеров, пожалуйста, посетите 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}");
    }
}

Скачивание изображений HTML с помощью cURL

Кроме фрагмента кода C#, мы также можем использовать команды cURL для загрузки изображений из HTML-файлов.

Шаг 1 — Сгенерировать токен доступа: Первый шаг в этом подходе заключается в создании JWT-токена доступа на основе учетных данных клиента.

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"}"

Попробуйте бесплатный онлайн извлекатель изображений HTML

Мы предлагаем бесплатный онлайн Online HTML Image Extractor, разработанный на основе GroupDocs.Parser Cloud API. Установка или загрузка программного обеспечения не требуется, и вы можете оценить возможности REST API в веб-браузере.

извлечение html изображений

Заключение

В этой статье мы узнали самый точный способ извлечения изображений из HTML с использованием .NET REST API. С помощью этого API вы можете:

  • Извлеките встроенные и инлайн-изображения
  • Разобрать изображения, закодированные в Base64
  • Извлечь изображения фона CSS
  • Извлечь метаданные для связанных изображений
  • Скачайте все изображения программно

Поэтому это лучшее решение для автоматизации извлечения медиа в формате HTML в приложениях на C#.

Связанные статьи

Мы настоятельно рекомендуем посетить следующие статьи, чтобы узнать больше о:

Часто задаваемые вопросы (ЧЗВ)

  1. Могу ли я извлечь встроенные изображения в формате Base64 из HTML? Да, API автоматически извлекает изображения в формате Base64 и встроенные HTML-изображения.

  2. Извлекает ли API внешне связанные изображения? API извлекает метаданные для связанных изображений; их загрузка является необязательной.

  3. Могу ли я извлечь изображения, упомянутые в CSS? Да, изображения, упомянутые через встроенный или встраиваемый CSS, поддерживаются.

  4. Какие форматы изображений поддерживаются? JPG, PNG, BMP, GIF, TIFF и другие распространенные типы изображений.

  5. Есть ли бесплатная пробная версия? Да. Вы можете создать бесплатную учетную запись и получить 150 бесплатных вызовов API в месяц.