Кодируйте изображения онлайн
Кодируйте изображения с помощью Aspose.SVG for .NET API в режиме реального времени! Загрузите изображение из локальной файловой системы, и вы немедленно получите результат в виде data URI, Base64 Image для встраивания в HTML и CSS Background. Поддерживаются 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],<кодированные данные в виде строки Base64>
.
Поскольку размер данных в кодировке Base64 увеличивается на 33 %, рекомендуется использовать URI данных только для небольших изображений. Большие изображения Base64 создают много кода в HTML, что приводит к потере преимуществ в производительности. Файлы GIF имеют небольшой размер, что делает их идеальными для использования в качестве URI данных на веб-сайтах для логотипов, значков, штриховых рисунков и многого другого.
Как конвертировать GIF в Base64 на С#
Чтобы преобразовать GIF в строку Base64, мы используем API Aspose.SVG for .NET, который является многофункциональным, мощным и простым в работе с документами для платформы C#. Рассмотрим пример кодирования GIF в Base64 и встраивания строки Base64 в качестве URI данных в документ SVG. Эти операции можно выполнить с помощью нескольких строк кода:
Код С# для преобразования GIF в строку Base64 и встраивания ее в файл SVG
// Open a binary file – GIF image
var bytes = File.ReadAllBytes(@"image.gif");
// 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 GIF to Base64
img.Href.BaseVal = "data:image/gif;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");
Шаги по преобразованию GIF в Base64 на C#
- Откройте изображение GIF для конвертации. Используйте метод ReadAllBytes(
path
), чтобы открыть изображение GIF и прочитать содержимое файла в массив байтов. - Инициализируйте новый экземпляр класса SVGDocument.
- Используйте метод
CreateElementNS(
namespaceURI,qualName
) класса SVGDocument для создания экземпляр изображения.namespaceURI
устанавливает ссылку на спецификацию W3C SVG.qualifiedName
должно содержать строковое имя тега элемента изображения. - Конвертируйте GIF в Base64. Вызовите метод ToBase64String(bytes) для преобразования массива 8-разрядных целых чисел в его эквивалентное строковое представление, кодированное в цифрах Base64.
- Добавьте элемент изображения в документ SVG, используя метод
AppendChild(
node
). - Используйте метод
Save(
path
,) чтобы сохранить документ SVG.
Плюсы и минусы использования Data URI
URI данных дает нам разумный способ вставлять изображения на веб-страницу. Схемы URI можно использовать разными способами. Но в любом случае есть плюсы и минусы.
Плюсы:
- Ускорение загрузки страниц. Браузеру не нужно делать дополнительный веб-запрос для извлечения файла, поскольку изображение уже встроено в HTML-документ.
- Улучшение производительности. Браузер требует меньше процессорного времени.
- Веб-страницы становятся независимыми от внешних файлов, что упрощает их совместное использование даже в автономном режиме.
Минусы:
- Размер данных, кодированных в Base64, на 1/3 больше, чем у двоичного изображения.
- Кодированные изображения не кэшируются браузером и будут загружаться при каждом посещении такой страницы.
- Кодированные изображения трудно редактировать, поскольку сначала необходимо декодировать строку Base64.
- Изображение Base64 никогда не будет проиндексировано Google, поскольку оно не отображается в результатах поиска изображений.
Онлайн Кодировщик Base64
Aspose.SVG предлагает бесплатные онлайн-приложения для кодирования и декодирования двоичных данных:
- Кодировщик Base64 представляют собой набор инструментов, позволяющих кодировать двоичные данные в различных выходных форматах: Plain Base64, JSON, XML, URI или CSS.
- Base64 Конвертер Изображений преобразует URI данных, содержащий строку Base64, в изображение путем вставки строки URI в элемент управления вводом.
Наши браузерные приложения работают на всех платформах, включая Windows, Linux, Mac OS, Android и iOS. Для вас не требуется регистрация или установка программного обеспечения. Начните использовать наши онлайн-инструменты кодирования/декодирования Base64 безопасно, надежно и просто!
Примеры использования кодировки Base64
{{i18n.examples.svg}}
{{i18n.code-svg}}
HTML-код для встраивания GIF-изображения в кодировке Base64
<body>
<div>
<img src="data:image/gif;base64,R0lGODlhMgAyAPMMAA1dKxdkNC90STV4TkWCXFWNamGVdIaulZe..." alt="Green circle">
</div>
</body>
Код CSS для встраивания изображения Base64 GIF в качестве фонового изображения
.class {
background-image: url('data:image/gif;base64,R0lGODlhMgAyAPMMAA1dKxdkNC90STV4TkWCXFWNamGVdIaulZe...');
}
Код XML для встраивания GIF-изображения Base64 в XML-документ
<?xml version="1.0" encoding="UTF-8"?>
<root>
<image mime = "image/gif">R0lGODlhMgAyAPMMAA1dKxdkNC90STV4TkWCXFWNamGVdIaulZe...</image>
</root>
Код JSON для встраивания GIF-изображения Base64 в документ JSON
{
"image": {
"mime": "image/gif",
"data": "R0lGODlhMgAyAPMMAA1dKxdkNC90STV4TkWCXFWNamGVdIaulZe..."
}
}
FAQ
Aspose.SVG позволяет кодировать GIF в Base64 любым способом – онлайн или программно. Например, вы можете кодировать GIF в режиме реального времени с помощью онлайн приложения Кодировать GIF , которое быстро и качественно преобразует ваши GIF файлы. Загрузите, конвертируйте GIF и получите результат за несколько секунд! Кроме того, вы можете использовать Aspose.SVG for .NET API для программного преобразования GIF в Base64.
Исторически сложилось так, что многие форматы передачи и хранения данных используют текст вместо двоичного кода (HTML, XML, электронная почта и т. д.). Что делать, если формат передачи данных текстовый, а вам нужно передавать двоичные данные? Здесь на помощь приходит кодировка Base64. Чтобы предотвратить неправильное толкование двоичных символов при отправке данных через Интернет, необходимо кодировать их в Base64 символы. Некоторые типичные применения кодировки Base64: схемы данных URI для изображений (CSS, HTML, JSON); передача изображений и других бинарных данных в XML; хранение изображений в базе данных; включение изображений в сообщения электронной почты.
Data URI – это самый быстрый и простой способ встроить изображения и другие файлы на ваши веб-страницы. Data URI поддерживается основными современными браузерами: Chrome, Firefox, Safari, Edge, Opera и IE8+.
Base64 – это схема преобразования двоичного кода в текст, которая представляет двоичные данные в формате строки ASCII. Кодирование Base64 обычно используется, когда необходимо кодировать двоичную информацию, которую необходимо хранить и передавать по носителям, предназначенным для работы с текстовыми данными.
Начало работы с Aspose.SVG for .NET API
Установите из командной строкиnuget install Aspose.SVG
или через консоль диспетчера пакетов Visual Studio с помощью Install-Package Aspose.SVG
.
В качестве альтернативы можно получить автономный установщик MSI или DLL-файлы в ZIP-файле из
загрузки.
Aspose.SVG for .NET API является автономной библиотекой и не зависит от какого-либо программного обеспечения для обработки документов SVG. Дополнительные сведения об установке библиотеки C# и системных требованиях вы найдете в
документации Aspose.SVG.Другие поддерживаемые Кодировщики Base64
Вы можете преобразовать изображение в строку Base64. Поддерживаются форматы JPG, PNG, BMP, GIF, TIFF, ICO и SVG: