Если вы создаете веб-приложение, вы определенно захотите включить загрузку изображений. Загрузка изображений является важной функцией в современных приложениях, и известно, что изображения полезны при поисковой оптимизации.

В этом руководстве (которое является первой частью серии «Загрузка изображений Rails») я покажу вам, как включить загрузку изображений в приложении Rails с помощью CarrierWave. Это будет простое приложение, поскольку основное внимание уделяется загрузке изображений.

CarrierWave — это гем Ruby, который предоставляет простой и чрезвычайно гибкий способ загрузки файлов из приложений Ruby. Вы должны иметь Rails на своей машине, чтобы следовать. Чтобы быть уверенным, откройте свой терминал и введите команду ниже:

bash rails -v

Это покажет вам версию Rails, которую вы установили. Для этого урока я буду использовать версию 4.2.4, которую вы можете установить следующим образом:

bash gem install rails -v 4.2.4

С этим, вы готовы идти.

Установка приложений Rails

Теперь создайте новый проект Rails:

rails rails new mypets

Откройте свой Gemfile и добавьте следующие драгоценные камни.

Рельсы Gemfile

… Gem ‘carrierwave’, ‘~> 0.10.0’ gem ‘mini_magick’, ‘~> 4.3’… « `

Первый драгоценный камень предназначен для CarrierWave, а второй драгоценный камень с именем mini_magick помогает изменить размеры изображений в приложении Rails. После этого запустите пакетную установку.

Создайте ресурс скаффолда, чтобы добавить функциональность CarrierWave. Запустите следующую команду из вашего терминала:

rails rails g scaffold Pet name:string description:text image:string

Скаффолд в Rails — это полный набор моделей, миграция базы данных для этой модели, контроллер для манипулирования ею, представления для просмотра и обработки данных и набор тестов для каждого из вышеперечисленных.

Перенос вашей базы данных следующий:

rails rake db:migrate

Настройка CarrierWave

Вам необходимо создать инициализатор для CarrierWave, который будет использоваться для загрузки CarrierWave после загрузки ActiveRecord.

Перейдите к config> initializer и создайте файл: carrier_wave.rb.

Вставьте код ниже в него.

« `рельсы

конфиг / Инициализаторы / carrier_wave.rb

требуют ‘carrierwave / orm / activerecord’ « `

Из вашего терминала сгенерируйте загрузчик:

bash rails generate uploader Image

Это создаст новый каталог с именем uploaders в папке приложения и файл внутри с именем image_uploader.rb . Содержимое файла должно выглядеть так:

« `rails app / uploaders / image_uploader.rb

кодировка: utf-8

Класс ImageUploader <CarrierWave :: Uploader :: Base

# Включить поддержку RMagick или MiniMagick: # включить CarrierWave :: RMagick # включить CarrierWave :: MiniMagick

# Выберите, какой тип хранилища использовать для этого загрузчика: storage: file # storage: fog

# Переопределить каталог, в котором будут храниться загруженные файлы. # Это разумное значение по умолчанию для загрузчиков, которые должны быть смонтированы: def store_dir «uploads / # {model.class.to_s.underscore} / # {mount_as} / # {model.id}» end

# Укажите URL-адрес по умолчанию, если файл не был загружен: # def default_url # # Для Rails 3.1+ совместимость с конвейером ресурсов: # # ActionController :: Base.helpers.asset_path («fallback /» + [version_name, «Default.png»]. Compact.join (‘ ‘)) # # «/ images / fallback /» + [version_name, «default.png»]. Compact.join (‘ ‘) # end

# Обрабатывать файлы по мере их загрузки: # process: scale => [200, 300] # # def scale (width, height) # # делать что-то # end

# Создайте разные версии ваших загруженных файлов: # version: thumb do # process: resize_to_fit => [50, 50] # end

# Добавить белый список расширений, которые могут быть загружены. # Для изображений вы можете использовать что-то вроде этого: # def extension_white_list #% w (jpg jpeg gif png) # end

# Переопределите имя файла загруженных файлов: # Избегайте использования model.id или version_name здесь, смотрите uploader / store.rb для деталей. # def имя файла # «что-то.jpg», если оригинальное_файл имя # конец

конец « `

Вы можете редактировать его, чтобы соответствовать тому, что вы хотите. Позвольте мне пройти через это.

Во-первых, раскомментируйте линейку MiniMagick. Это должно быть строка 7.

rails ... include CarrierWave::MiniMagick ...

Это необходимо для создания разных версий изображения. Если вы хотите создать уменьшенную версию загруженных изображений, в файл image_uploader уже включена форма кода. Раскомментируйте блок кода версии, как показано ниже:

rails ... version :thumb do process :resize_to_fill => [50, 50] end ...

Вы также можете добавить разные версии, используя один и тот же формат.

Для целей данного урока мы будем сохранять в файл, а не в туман. Fog — это библиотека облачных сервисов Ruby. Я покажу вам, как использовать его в другой части этой серии. Так что оставьте свой вариант хранения как есть.

В целях безопасности определенные файлы могут представлять угрозу, если их разрешить загружать в неправильное место. CarrierWave позволяет вам указать белый список разрешенных расширений. Вы должны увидеть метод, похожий на тот, что у меня ниже, поэтому раскомментируйте его.

rails ... def extension_white_list %w(jpg jpeg gif png) end ...

Настало время смонтировать ваш загрузчик. Перейдите к своей модели и вставьте код ниже.

« `rails app / model / pet.rb

mount_uploader: изображение, ImageUploader « `

Перейдите к вашим представлениям и отредактируйте их, чтобы они выглядели так, как показано ниже

« `rails app / views / pets / _form.html.erb

<% = form_for @pet, html: {multipart: true} do | f | %> <% if @ pet.errors.any? %> <div id = «error_explanation»> <h2> <% = множественное число (@ pet.errors.count, «error»)%> запретило сохранение этого питомца: </ h2>

  <UL>
   <% @ pet.errors.full_messages.each do | сообщение |  %>
     <li> <% = message%> </ li>
   <% end%>
   </ UL>
 </ div> <% end%>

<% end%> « `

Откройте свой терминал и запустите сервер rails s : rails s .

В браузере укажите http: // localhost: 3000 / pets . Вы должны иметь возможность добавить нового питомца, введя имя и описание и загрузив изображение. Изображение не отображается после успешной загрузки. Позвольте мне показать вам, как это исправить.

Перейдите на свою страницу показа, где вы отображаете изображение, и отредактируйте его, чтобы соответствовать тому, что у меня есть ниже:

« `rails app / views / pets / show.html.erb

<% = уведомление%>

Имя: <% = @ pet.name%>

Описание: <% = @ pet.description%>

Изображение: <% = image_tag @ pet.image.thumb.url%>

<% = link_to ‘Изменить’, edit_pet_path (@pet)%> | <% = link_to ‘Back’, pets_path%> « `

Это отобразит уменьшенную версию изображения.

CarrierWave позволяет легко удалить ранее загруженный файл на смонтированном загрузчике с помощью всего лишь флажка. Я покажу вам, как это сделать.

Откройте файл формы и внесите небольшие изменения. Отредактируйте это, чтобы быть похожим на это:

« `rails app / views / pets / _form.html.erb <% = form_for @pet, html: {multipart: true} do | f | %> <% if @ pet.errors.any? %> <div id = «error_explanation»> <h2> <% = множественное число (@ pet.errors.count, «error»)%> запретило сохранение этого питомца: </ h2>

  <UL>
   <% @ pet.errors.full_messages.each do | сообщение |  %>
     <li> <% = message%> </ li>
   <% end%>
   </ UL>
 </ div> <% end%>

<% end%> « `

В приведенном выше коде мы проверили, существует ли уже объект изображения. Если есть, мы отображаем изображение и возможность удалить его, но если его нет, мы отображаем только поле для загрузки изображения.

Перейдите к своему контроллеру и добавьте :remove_image к своим параметрам. Перезагрузите страницу редактирования, установите флажок, нажмите « Обновить питомца» , и изображение будет удалено.

Проверка размера изображения

Есть разные способы сделать это. Я покажу вам простой и быстрый способ. Откройте модель своего питомца и вставьте код ниже:

« `rails * app / model / pet.rb validates_processing_of: проверка изображения: image_size_validation

private def image_size_validation errors [: image] «« должно быть меньше 500 КБ », если image.size> 0.5.megabytes end` «

Это поможет гарантировать, что ни одно изображение размером более 500 КБ не будет загружено в ваше приложение Rails. Запустите сервер rails и проверьте, что у вас есть.

Вывод

Теперь вы знаете, как включить загрузку изображений в вашем приложении Rails. Вы также узнали, как проверить формат и размер, а также удалить изображение. В следующей части этой серии мы рассмотрим, как использовать CarrierWave вместе с Devise.