Rails/Ruby сохраняет изображение как base64 и получает доступ к нему в виде

Я хотел бы знать, можем ли мы преобразовать изображение в base64 и сохранить его в базе данных и получить к нему доступ в представлениях.

Я искал google и stackoverflow, все они начинаются с середины, как кодирование, или отображают изображение.

Мне нужно знать, как мы можем преобразовать url/path изображения (скажем, я сохраняю изображение внутри своего приложения и его URL-адрес, сохраненный в столбце)

Как закодировать его как base64 перед сохранением (нужно ли сначала преобразовать в base64 и сохранить в db?). Как отобразить его в представлениях

Ответ 1

Вы можете разделить эту задачу на три или четыре этапа:

  • получение изображения
  • кодировка base64
  • сохранение его в базе данных (необязательно)
  • отобразить его в виде

Получение изображения

От конвейера активов

Если вы используете конвейер ресурсов Rails для этого, вы можете использовать хеш Rails.application.assets для получения изображения: Rails.application.assets['image_name.png'].to_s предоставит вам контент image_name.png.

из файла - локальный или по URL

Здесь возникает вопрос о том, что в StackOverflow.

закодировать

Документация модуля Base64 Ruby сообщает, как использовать кодировку Base64 в Ruby:

Base64.strict_encode64(your_content_here)

ПРИМЕЧАНИЕ: в этом случае strict_encode64 предпочтительнее всего encode64, потому что он не добавляет новые строки. (кредит идет на Сергей Мелл за указание этого)

Из документов:

  • encode64 - ... Line feeds are added to every 60 encoded characters.
  • strict_encode64 - ... No line feeds are added.

Хранить в базе данных (необязательно)

Я предлагаю вам создать для него отдельную модель ActiveRecord, с полем типа text, чтобы сохранить изображение в формате base64.

Отобразить его в виде

Вы можете предоставить атрибут data-url для атрибута src тега img, поэтому браузер будет декодировать изображение из base64 и отображать его точно так же, как и обычное изображение:

<img src="data:image/png;base64,YOUR_BASE64_HERE"/>

Не забудьте изменить формат изображения в любом формате, который вы используете в разделе data:image/png.