Кодування зображень онлайн

Кодуйте зображення за допомогою API Aspose.SVG для .NET у реальному часі! Завантажте зображення з локальної файлової системи, і ви негайно отримаєте результат як URI даних, джерело зображення Base64 і фонове джерело CSS Base64. Підтримуються SVG, JPG, JPEG, PJP, PJPEG, PNG, BMP, XBM, GIF, TIFF, ICO, IFIF, WEBP та інші формати зображень.

Про схему URI

URI даних – це метод вбудовування зображень та інших файлів у веб-сторінки у вигляді рядка тексту на основі кодування Base64. Схема URI даних дозволяє включати будь-які двійкові дані в документи HTML, CSS, JSON або SVG. Наприклад, ви можете вставляти зображення на веб-сторінку так, ніби їх було завантажено із зовнішнього ресурсу, але замість вказівки URL-адреси файлу ви вставляєте вміст зображення, кодований у форматі Base64. Схема URI даних була визначена в RFC 2397, і станом на 2022 рік вона повністю підтримується більшістю основних браузерів. Основною перевагою використання URI даних є прискорення завантаження сторінки, оскільки браузеру не потрібно робити додатковий веб-запит для отримання файлу, оскільки зображення вже вбудовано в документ HTML.

Синтаксис URI даних такий: data:[<mime type>][;charset=<charset>][;base64],<encoded data>.

Оскільки розмір даних у кодуванні Base64 збільшується на 33%, рекомендується використовувати URI даних лише для невеликих зображень. Великі зображення Base64 створюють багато коду в HTML, що призводить до втрати продуктивності.


Як перетворити BMP на Base64 у C#

Щоб перетворити BMP на рядок Base64, ми використовуємо API Aspose.SVG для .NET, який є багатофункційним, потужним і простим у використанні API обробки документів для платформи C#. Ми розглядаємо приклад кодування BMP до Base64 і вбудовування рядка Base64 як URI даних у документ SVG. Ці операції можна виконати за допомогою кількох рядків коду:


Код C# для перетворення BMP у рядок Base64 і вбудовування його у файл SVG

    // Open a binary file - BMP image
    var bytes = File.ReadAllBytes(@"image.bmp");
    // Initialize an SVGDocument object
    var document = new SVGDocument();
    // Create an image element
    var img = (SVGImageElement)document.CreateElementNS("http://www.w3.org/2000/svg", "image");
    // Convert BMP to Base64
    img.Href.BaseVal = "data:image/bmp;charset=utf-8;base64," + Convert.ToBase64String(bytes);
    // Add the image element into the SVG document
    document.RootElement.AppendChild(img);
    // Save the SVG document
    document.Save(@"image-base64.svg");



Кроки для перетворення BMP на Base64 у C#

  1. Відкрийте зображення BMP для конвертації. Використовуйте метод ReadAllBytes(path), щоб відкрити зображення BMP і зчитати вміст файлу в масив байтів.
  2. Ініціалізуйте новий екземпляр класу SVGDocument.
  3. Використовуйте метод CreateElementNS(namespaceURI, qualifiedName) класу SVGDocument, щоб створити екземпляр зображення. Простір імен URI namespaceURI встановлює посилання на специфікацію W3C SVG. qualifiedName має містити назву тегa елемента image.
  4. Перетворіть BMP на Base64. Викликайте метод ToBase64String(bytes), щоб перетворити масив 8-розрядних цілих чисел на його еквівалентне рядкове представлення, кодоване цифрами з основою 64.
  5. Додайте елемент зображення в документ SVG за допомогою методу AppendChild(node).
  6. Викличте метод Save(path), щоб зберегти документ SVG.

Плюси та мінуси URI даних

URI даних дає нам розумний спосіб вставляти зображення на веб-сторінку. Схеми URI можна використовувати різними способами. Але в будь-якому випадку є свої плюси і мінуси.

Переваги:

  • Прискорення завантаження сторінки. Браузеру не потрібно робити додатковий веб-запит, щоб отримати файл, оскільки зображення вже вбудовано в документ HTML.
  • Поліпшення продуктивності. Браузер потребує менше процесорного часу.
  • Веб-сторінки стають незалежними від зовнішніх файлів, завдяки чому ними легко ділитися навіть у режимі офлайн.

Недоліки:

  • Розмір кодованих даних Base64 на 1/3 більший за двійкове зображення.
  • Кодовані зображення не кешуються браузером і завантажуватимуться кожного разу, коли відвідується така сторінка.
  • Кодовані зображення важко редагувати, оскільки спочатку потрібно декодувати рядок Base64.
  • Зображення Base64 ніколи не буде проіндексовано Google, оскільки воно не відображається в результатах пошуку зображень.

Онлайн Кодери Base64

Aspose.SVG пропонує безкоштовні онлайн-застосунки для кодування та декодування двійкових даних:

  • Base64 Encoders – це набір інструментів, які дозволяють кодувати двійкові дані в різних вихідних форматах: Plain Base64, JSON, XML, URI або CSS.
  • Image Base64 Decoder перетворює URI даних, що містить рядок Base64, на зображення, вставляючи рядок URI в елемент керування введенням.

Наші браузерні застосунки працюють на всіх платформах, включаючи Windows, Linux, Mac OS, Android та iOS. Вам не потрібна реєстрація, плагін або встановлення програмного забезпечення. Почніть використовувати наші онлайн-інструменти кодування/декодування Base64 безпечно, надійно та просто!

Приклади використання кодування Base64

Код SVG для вставлення зображення Base64 BMP у документ SVG

<svg xmlns="http://www.w3.org/2000/svg">
	<image href="data:image/bmp;charset=utf-8;base64,Qk04DAAAAAAAADYAAAAoAAA..." alt="Blue circle"/>
</svg>

HTML-код для вставлення зображення Base64 BMP

<body>
    <div>
        <img src="data:image/bmp;base64,Qk04DAAAAAAAADYAAAAoAAA..." alt="Blue circle">
    </div>
</body>

Код CSS для вставлення Base64 BMP як фонового зображення

.class {
    background-image: url('data:image/bmp;base64,Qk04DAAAAAAAADYAAAAoAAA...');
}

Код XML для вставлення зображення Base64 BMP у документ XML

<?xml version="1.0" encoding="UTF-8"?>
<root>
<image mime = "image/bmp">Qk04DAAAAAAAADYAAAAoAAA...</image>
</root>

Код JSON для вставлення зображення Base64 BMP у документ JSON

{
  "image": {
    "mime": "image/bmp",
    "data": "Qk04DAAAAAAAADYAAAAoAAA..."
  }
}



FAQ

1. Як перетворити BMP на Base64?

Aspose.SVG дозволяє конвертувати BMP у рядок Base64 будь-яким способом – онлайн чи програмно. Наприклад, ви можете кодувати BMP у режимі реального часу за допомогою Онлайн Кодера BMP , який перетворює ваші файли швидко та якісно. Завантажте, кодуйте BMP і отримайте результат за кілька секунд! З іншого боку, ви можете використовувати Aspose.SVG для .NET API, щоб програмно перетворити BMP на Base64.

2. Навіщо потрібне кодування Base64?

Історично багато форматів передачі та зберігання даних використовують текст замість двійкового коду (HTML, XML, електронна пошта тощо). Що робити, якщо формат передачі даних є текстовим, але вам потрібно передати двійкові дані? Тут на допомогу приходить кодування Base64. Щоб запобігти неправильній інтерпретації двійкових символів під час надсилання даних через Інтернет, необхідно кодувати їх у символи. Деякі типові застосування кодування Base64: схеми даних URI для зображень (CSS, HTML, JavaScript); перенесення зображень та інших двійкових даних у XML; зберігання зображень у базі даних; включення зображень у повідомлення електронної пошти.

3. Які браузери підтримують дані URI?

Data URI – це найшвидший і найпростіший спосіб вставляти зображення та інші файли на ваші веб-сторінки. Data URI підтримується основними сучасними браузерами: Chrome, Firefox, Safari, Edge, Opera та IE8+.

4. Що таке кодування Base64?

Base64 – це схема кодування двійкового коду в текст, яка представляє двійкові дані у рядковому форматі ASCII. Кодування Base64 зазвичай використовується, коли необхідно закодувати двійкову інформацію, яку потрібно зберігати та передавати через носій, призначений для роботи з текстовими даними.

Початок роботи з .NET SVG API

Якщо ви зацікавлені в розробці масштабованої векторної графіки та її застосуванні, встановіть наш гнучкий, високошвидкісний Aspose.SVG для .NET API із потужним набором інтерфейсів для C# та інших мов програмування .NET.
Встановіть із командного рядка як nuget install Aspose.SVG або через консоль диспетчера пакетів Visual Studio за допомогою Install-Package Aspose.SVG. Крім того, отримайте офлайн-інсталятор MSI або бібліотеки DLL у ZIP-файлі з завантажень. Aspose.SVG для .NET API – це окрема бібліотека, яка не залежить від будь-яке програмне забезпечення для обробки документів SVG.
Щоб отримати докладніші відомості про встановлення бібліотеки C# і системні вимоги, зверніться до документації Aspose.SVG.

Інші підтримувані Кодери Base64

Ви можете конвертувати зображення в рядок Base64. Підтримуються формати JPG, PNG, BMP, GIF, TIFF, ICO та SVG:

JPG to Base64 (JPEG Image)
PNG to Base64 (Portable Network Graphics)
BMP to Base64 (Bitmap Image)
SVG to Base64 (Scalable Vector Graphics)
TIFF to Base64 (Tagged Image Format)
GIF TO Base64 (Graphical Interchange Format)
ICO to Base64 (Computer Icons Format)
Image to Base64 (Binary Image)