CarrierWave — это жемчужина для управления загруженными файлами в приложении Rails, в этом уроке мы рассмотрим процесс загрузки и обработки изображений.
Теперь предположим, что мы хотим иметь приложение, где пользователи могут загружать изображения и отображать их в галерее.
Начиная
Первое, что нам нужно сделать, — это создать новый проект rails, в который мы будем добавлять функции загрузки и обработки изображений, поэтому запустите окно терминала и выполните следующую команду:
$> rails new your_proyect_name
If you already have a created project you can skip this step.
Зайдите в каталог проекта и откройте его в вашем любимом текстовом редакторе, откройте Gemfile, перейдите в конец файла и добавьте туда камень несущей .
gem 'carrierwave'
После того, как вы добавили драгоценный камень в свой Gemfile, вернитесь в окно терминала и выполните команду bundle, чтобы установить драгоценный камень.
Эшафот
Теперь давайте создадим ресурс scaffold для добавления функциональности carrierwave, в окне вашего терминала выполните следующую команду:
$> rails g scaffold your_scaffold title:string description:text image:string
Эта команда создаст необходимые файлы и папки для работы с нами. Когда у нас есть ресурс scaffold, пришло время проверить его в нашем браузере, в окне терминала выполните следующую команду.
$> rails s
Чтобы получить последнее приглашение, откройте браузер и перейдите по адресу: localhost: 3000 Если вы не получили никаких ошибок, пора запустить наши миграции для создания необходимых таблиц в нашей базе данных, поэтому вернитесь в окно терминала и запустите следующий:
$> rake db:migrate
Загрузчик
После переноса нашей базы данных нам нужно создать загрузчик с помощью следующей команды.
$> rails g uploader your_uploader
Эта команда создаст папку в каталоге вашего приложения, которая называется «загрузчики», и внутри этой папки вы найдете созданный вами класс загрузчиков, откроете загрузчик в текстовом редакторе и увидите, что в этом файле уже есть некоторый код, и он поставляется с довольно хорошая документация о том, как вы можете настроить его, но для целей этого урока мы можем оставить все как есть. Теперь откройте вашу модель Image, чтобы смонтировать загрузчик:
| #This should go in your model | |
| mount_uploader :image, YourUploaderClass |
by Добавьте эту строку под свой вызов attr_accessible, и это должно быть все, что вам нужно добавить в вашу модель, чтобы завершенный код модели выглядел следующим образом.
| class Image < ActiveRecord::Base | |
| attr_accessible :description, :image, :title | |
| mount_uploader :image, ImagesUploader | |
| end |
Виды
Перейдите в папку представлений и откройте файл «new.html.erb», созданный скаффолдом, здесь отредактируйте следующую строку и включите форму для загрузки файлов.
| <%= form_for(@image) do |f| %> |
Таким образом, отредактированная строка должна выглядеть так:
| <%= form_for @image, html: { multipart: true } do |f| %> |
Также нам нужно отредактировать ввод для изображения, чтобы мы могли выбрать файл с нашего локального компьютера и загрузить его, поэтому в том же виде отредактируйте эту строку:
| <%= f.text_field :image %> |
Замените «текстовое поле» на «файловое поле», сохраните файл и перейдите к вашему «show.html.erb»
Отображение изображения
Когда вы окажетесь в шаблоне шоу, найдите следующую строку:
<%= @image.image %>
И заменить это на это:
<%= @image.image_url %>
One little gotcha is that when no image is saved to the database this will return nil, so you might want to convert the 'image_url' to a string with a call to the 'to_s' method.
Большой палец
Как только это будет сделано, пришло время попробовать, так что запустите ваш сервер rails и перейдите к «localhost: 3000 / images / new» здесь, загрузите изображение и убедитесь, что все работает как положено.
Теперь, когда вы загрузили изображение, вы заметите, что в шаблоне индекса он по-прежнему показывает простой URL-адрес изображения, так что пришло время сделать версию изображения в виде большого пальца.
Установка ImageMagick
Теперь, если вы работаете на Mac, это сделает вашу жизнь намного проще, если у вас установлен «homebrew», просто выполните следующую команду:
$> brew install imagemagick
If you're following this tutorial on other than Mac you can find the documentation on ImageMagick here:ImageMagick
Иди, возьми чашку кофе или пиво, если хочешь, и подожди, пока она закончится.
Как только мы установим ImageMagick, перейдите к файлу загрузки и удалите комментарий в следующей строке:
include CarrierWave::MiniMagick
Это даст нам обертку ImageMagick для ruby, я рекомендую мини-магику, поскольку она дает нам доступ к набору вспомогательных методов для очень простого манипулирования изображениями, поэтому после удаления комментария добавьте этот фрагмент кода в файл загрузчика.
| # This should go in your uploader | |
| version :thumb do | |
| process resize_to_fit: [50, 50] | |
| end |
Это обработает загруженное изображение и изменит его размер до указанных размеров.
Отображение большого пальца
Откройте файл index.html.erb и найдите эту строку:
<%= image.image %>
И добавьте метод url, передающий версию, которую вы хотите отобразить, в нашем случае это большой палец, например:
<%= image_tag image.image_url(:thumb) %>
Заключительный этап
Откройте свой драгоценный файл еще раз и добавьте драгоценный камень mini_magick под драгоценный камень carrierwave:
gem "mini_magic"
Вернитесь в окно терминала и выполните команду bundle, чтобы установить гем, после того, как установка закончит установку, зайдите на «localhost: 3000 / images / new» и загрузите изображение, если все прошло хорошо, вы должны увидеть свое загруженное изображение. надеюсь, вам понравилось, в шаблоне шоу и в увеличенной версии изображения в шаблоне индекса.
Дальнейшее чтение
Если вы считаете, что carrierwave — правильный выбор для вас, вы можете посетить их вики- страницу на github, чтобы получить больше информации о том, как настроить более сложный загрузчик.