Tại sao trích xuất hình ảnh từ HTML? (Lợi ích và trường hợp sử dụng)

Các tệp HTML thường bao gồm nhiều loại hình ảnh khác nhau, chẳng hạn như: Hình ảnh thẻ <img> tiêu chuẩn, hình ảnh nội tuyến Base64 (data:image/...), hình ảnh được định nghĩa trong CSS (ví dụ, background-image), biểu tượng và đồ họa SVG, hình ảnh liên kết bên ngoài hoặc, tài nguyên hình ảnh nhúng. Việc trích xuất hình ảnh từ các tài liệu HTML rất hữu ích cho:

  • Di chuyển nội dung
  • Trích xuất phương tiện từ email HTML
  • Thu thập dữ liệu trên web và phân tích
  • Chuẩn bị bộ dữ liệu đào tạo cho học máy
  • Chuyển đổi HTML thành PDF/Word mà vẫn giữ nguyên phương tiện
  • Lưu trữ các trang web với tài sản gốc

HTML Processing API

GroupDocs.Parser Cloud SDK for .NET là một API dựa trên REST mạnh mẽ có khả năng xử lý tất cả các định dạng tệp phổ biến bao gồm cả tệp HTML. Nó cho phép bạn thao tác với các tệp HTML và bạn có thể sử dụng nó để:

  • Phân tích tài liệu HTML
  • Trích xuất hình ảnh nhúng và hình ảnh nội tuyến
  • Trích xuất hình ảnh được mã hóa Base64
  • Phát hiện các tham chiếu hình ảnh bên ngoài
  • Lấy siêu dữ liệu (kích thước, loại, đường dẫn)
  • Tải xuống hình ảnh đã trích xuất về máy tính.
  • Tự động hóa quy trình phân tích HTML

Các định dạng hình ảnh được hỗ trợ

Điều kiện tiên quyết

  • Một tài khoản GroupDocs Cloud (Client ID & Client Secret).
  • .NET 6.0+ đã được cài đặt.
  • Visual Studio hoặc IDE tương thích.
  • Gói NuGet: GroupDocs.Parser-Cloud

Cài đặt qua NuGet

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

Trích xuất hình ảnh từ HTML bằng C#

Dưới đây là ví dụ đầy đủ bằng C# mô tả cách trích xuất hình ảnh HTML bằng cách sử dụng Cloud API.

Bước 1 — Khởi tạo API:

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

Bước 2 — Cung cấp thông tin tệp HTML để phân tích:

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

Bước 3 — Trích xuất hình ảnh từ HTML (Nhúng, Nội tuyến & Base64):

var response = parserApi.Images(request);

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

Bước 4 — Tải Hình Ảnh Đã Giải Nén (Tương Thích với 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}");
    }
}
// Để biết thêm ví dụ, vui lòng truy cập [https://github.com/groupdocs-parser-cloud/groupdocs-parser-cloud-dotnet](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}");
    }
}

Tải hình ảnh HTML bằng cURL

Ngoài đoạn mã C# ra, chúng ta cũng có thể sử dụng lệnh cURL để tải xuống hình ảnh từ các tệp HTML.

Bước 1 — Tạo Mã Truy Cập: Bước đầu tiên trong cách tiếp cận này là tạo một mã thông báo truy cập JWT dựa trên thông tin xác thực của khách hàng.

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

Thử Trình Trích Xuất Hình Ảnh HTML Trực Tuyến Miễn Phí

Chúng tôi cung cấp một Trình trích xuất hình ảnh HTML trực tuyến miễn phí được phát triển dựa trên GroupDocs.Parser Cloud API. Không yêu cầu cài đặt hoặc tải xuống phần mềm và đánh giá khả năng của REST API trong trình duyệt web.

extract html images

Kết luận

Trong bài viết này, chúng ta đã học cách chính xác nhất để trích xuất hình ảnh từ HTML bằng cách sử dụng .NET REST API. Với sự trợ giúp của API này, bạn có thể:

  • Trích xuất hình ảnh nhúng và hình ảnh trong dòng
  • Giải mã hình ảnh mã hóa Base64
  • Trích xuất hình nền CSS
  • Lấy siêu dữ liệu cho các hình ảnh liên kết
  • Tải xuống tất cả hình ảnh một cách lập trình.

Do đó, đây là giải pháp tốt nhất để tự động hóa việc trích xuất phương tiện HTML trong các ứng dụng C#.

Các Bài Viết Liên Quan

Chúng tôi rất khuyến khích bạn tham quan các bài viết sau đây để tìm hiểu thêm về:

Câu hỏi thường gặp (FAQs)

  1. Tôi có thể trích xuất hình ảnh nhúng Base64 từ HTML không? Vâng, API tự động trích xuất hình ảnh HTML mã hóa Base64 và nội tuyến.

  2. API có trích xuất hình ảnh liên kết bên ngoài không? API trích xuất siêu dữ liệu cho các hình ảnh liên kết; việc tải xuống chúng là tùy chọn.

  3. Tôi có thể trích xuất hình ảnh được tham chiếu trong CSS không? Vâng, hình ảnh được tham chiếu thông qua CSS nội tuyến hoặc nhúng được hỗ trợ.

  4. Các định dạng hình ảnh nào được hỗ trợ? JPG, PNG, BMP, GIF, TIFF, và các loại hình ảnh thông thường khác.

  5. Có một bản dùng thử miễn phí không? Có. Bạn có thể tạo một tài khoản miễn phí và nhận 150 cuộc gọi API miễn phí hàng tháng.