Dlaczego wyodrębniać obrazy z HTML? (Korzyści i przypadki użycia)

Pliki HTML często zawierają kilka typów obrazów, takich jak: standardowe obrazy tagu <img>, obrazy inline w Base64 (data:image/...), obrazy zdefiniowane w CSS (np. background-image), ikony i grafiki SVG, obrazy linkowane zewnętrznie lub wbudowane zasoby obrazowe. Ekstrakcja obrazów z dokumentów HTML jest przydatna do:

  • Migracja treści
  • Ekstrakcja mediów z e-maili HTML
  • Web scraping and analysis
  • Przygotowywanie zbiorów danych treningowych dla uczenia maszynowego
  • Konwertowanie HTML na PDF/Word z zachowaniem mediów
  • Archiwizowanie stron internetowych z oryginalnymi zasobami

HTML Processing API

GroupDocs.Parser Cloud SDK for .NET to solidne, oparte na REST API, zdolne do przetwarzania wszystkich popularnych formatów plików, w tym plików HTML. Umożliwia manipulację plikami HTML i można go używać do:

  • Parse HTML documents
  • Wyodrębnij obrazy osadzone i w linii
  • Wyodrębnij obrazy zakodowane w Base64
  • Wykryj zewnętrzne odniesienia do obrazów
  • Pobierz metadane (rozmiar, typ, ścieżka)
  • Pobierz wyodrębnione obrazy lokalnie
  • Zautomatyzuj przepływy pracy parsowania HTML

Obsługiwane formaty obrazów

Wymagania wstępne

  • Konto GroupDocs Cloud (Client ID & Client Secret).
  • .NET 6.0+ zainstalowane.
  • Visual Studio lub kompatybilne IDE.
  • Pakiet NuGet: GroupDocs.Parser-Cloud

Zainstaluj przez NuGet

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

Ekstrakcja obrazów z HTML za pomocą C#

Poniżej znajduje się pełny przykład w C# ilustrujący ekstrakcję obrazów HTML z wykorzystaniem API w chmurze.

Krok 1 — Zainicjuj API:

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

Krok 2 — Podaj informacje o pliku HTML do analizowania:

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

Krok 3 — Wyodrębnij obrazy z HTML (osadzone, w linii i Base64):

var response = parserApi.Images(request);

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

Krok 4 — Pobierz wyodrębnione obrazy (kompatybilne z macOS i 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}");
    }
}

// Dla dalszych przykładów proszę odwiedzić 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}");
    }
}

Pobierz obrazy HTML za pomocą cURL

Oprócz fragmentu kodu C#, możemy również używać poleceń cURL do pobierania obrazów z plików HTML.

Krok 1 — Wygeneruj token dostępu: Pierwszym krokiem w tym podejściu jest wygenerowanie tokenu dostępu JWT na podstawie poświadczeń klienta.

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

Spróbuj darmowego internetowego narzędzia do ekstrakcji obrazów HTML

Oferujemy darmowy internetowy Online HTML Image Extractor opracowany na bazie GroupDocs.Parser Cloud API. Nie jest wymagana instalacja oprogramowania ani pobieranie i ocena możliwości REST API w przeglądarce internetowej.

extract html images

Wniosek

W tym artykule nauczyliśmy się najdokładniejszego sposobu na wyodrębnienie obrazów z HTML za pomocą interfejsu API REST .NET. Dzięki temu interfejsowi API możesz:

  • Wyodrębnij obrazy osadzone i w inline.
  • Parsuj obrazy zakodowane w Base64
  • Wyodrębnij obrazy tła CSS
  • Pobierz metadane dla powiązanych obrazów
  • Pobierz wszystkie obrazy programowo

Dlatego jest to najlepsze rozwiązanie do automatyzacji ekstrakcji mediów HTML w aplikacjach C#.

Powiązane artykuły

Zdecydowanie polecamy zapoznanie się z następującymi artykułami, aby dowiedzieć się więcej o:

Najczęściej zadawane pytania (FAQ)

  1. Czy mogę wyodrębnić obrazy osadzone w Base64 z HTML? Tak, API automatycznie wyodrębnia obrazy w kodowaniu Base64 i inline HTML.

  2. Czy API ekstraktuje obrazy linkowane z zewnątrz? API wyodrębnia metadane dla powiązanych obrazów; ich pobranie jest opcjonalne.

  3. Czy mogę wyodrębnić obrazy odniesione w CSS? Tak, obrazy odnoszone za pomocą wbudowanego lub osadzonego CSS są obsługiwane.

  4. Jakie formaty obrazów są obsługiwane? JPG, PNG, BMP, GIF, TIFF i inne powszechne typy obrazów.

  5. Czy jest dostępny darmowy okres próbny? Tak. Możesz utworzyć darmowe konto i otrzymać 150 darmowych wywołań API miesięcznie.