В первой части этой серии вы узнали, как использовать CarrierWave в своем приложении Rails. Во второй части вы узнаете, как включить загрузку изображений для ваших пользователей с помощью Devise. Devise — это решение для аутентификации в Rails. Вы также узнаете, как использовать fog , библиотеку облачных сервисов Ruby, которая позволит вашему приложению подключаться к Amazon Web Services.
Хватит разговоров — давай приступим к делу.
Установка приложений Rails
Создайте новое приложение для рельсов:
rails rails new myapp
Откройте свой Gemfile
и добавьте следующие драгоценные камни:
Рельсы Gemfile
драгоценный камень перевозчикволновый камень придумать драгоценный камень mini_magick драгоценный камень туман « `
Запустите bundle install
чтобы установить гемы.
Из вашего терминала создайте Pages controller
:
rails rails g controller Pages index
Перейдите к config/routes.rb
и добавьте корневой путь:
« `rails config / rout.rb
root to: ‘pages # index’ « `
Создать и настроить Devise
Функция загрузки будет интегрирована в нашу модель пользователя, чтобы пользователи могли загружать аватары. С вашего терминала установите devise:
rails rails generate devise:install
Генератор установит инициализатор, который описывает все параметры конфигурации Devise. Откройте app/views/layouts/application.html.erb
в текстовом редакторе и добавьте следующий код над блоком yield
:
« `rails app / views / layouts / application.html.erb
<% = уведомление%>
<% = alert%>
« `
На данный момент вы можете создать свою модель пользователя:
rails rails generate devise User
Затем перенесите вашу базу данных:
rails rake db:migrate
Вам нужно будет отредактировать виды разработок, поэтому важно, чтобы вы генерировали их:
rails rails generate devise:views
И это сделает волшебство.
Используя ваш текстовый редактор, откройте app/views/devise/registrations/new.html.erb
и отредактируйте его, чтобы он выглядел так:
« `rails app / views / devise / registrations / new.html.erb
зарегистрироваться
<% = form_for (ресурс, как: имя_ресурса, URL: регистрационный путь (имя_ресурса),: html => {multipart:: true}) do | f | %> <% = devise_error_messages! %>
<% = f.email_field: электронная почта, автофокус: true%>
<% = f.password_field: пароль, автозаполнение: «off»%>
<% = f.password_field: подтверждение_ пароля, автозаполнение: «выключен»%>
<% end%>
<% = сделать «devise / shared / links»%> « `
Сделайте то же самое для app/views/devise/registrations/edit.html.erb
:
« `rails app / views / devise / registrations / edit.html.erb
Изменить <% = имя_ресурса.to_s.humanize%>
<% = form_for (ресурс, как: имя_ресурса, URL-адрес: регистрационный_путь (имя_ресурса), html: {метод:: положить, multipart:: true}) do | f | %> <% = devise_error_messages! %>
<% = f.email_field: электронная почта, автофокус: true%>
<% if devise_mapping.confirmable? && resource.pending_reconfirmation? %> <div> В настоящее время ожидается подтверждение для: <% = resource.unconfirmed_email%> </ div> <% end%>
<% = f.password_field: пароль, автозаполнение: «off»%>
<% = f.password_field: подтверждение_ пароля, автозаполнение: «выключен»%>
<% if current_user.avatar.url.present? %> <% = image_tag (current_user.avatar.url)%> <% = f.label: remove_avatar do%> <% = f.check_box: remove_avatar%> <% end%> <% end%> <% = f .file_field: avatar%> <% = f.hidden_field: avatar_cache%>
<% = f.password_field: current_password, автозаполнение: «off»%>
<% end%>
Отменить мой аккаунт
Недовольны? <% = button_to «Отменить мою учетную запись», регистрационный путь (имя_ресурса), данные: {подтвердить: «Вы уверены?» }, метод:: удалить%>
<% = link_to «Назад»,: назад%> « `
После этого вам нужно будет добавить аватар в белый список и добавить столбец аватара в таблицу пользователей. С вашего терминала запустите миграцию, чтобы добавить новый столбец аватара.
« `рельсы
рельсы g миграция add_avatar_to_users аватар: строка rake db: мигрировать « `
Добавьте аватар CarrierWave к своей модели User — ваша модель должна выглядеть следующим образом:
« `rails models / user.rb
класс User <ActiveRecord :: Base mount_uploader: аватар, AvatarUploader
devise: database_authenticatable,: registerable,: recoverable,: вспоминаемый,: trackable,: validatable
# Проверка аватара пользователя validates_integrity_of: аватар validates_processing_of: avatar
private def avatar_size_validation error [: avatar] «« должно быть меньше 500 КБ », если avatar.size> 0.5.megabytes end end` «
В приведенном выше коде вы добавили строку mount_uploader
вверху класса User
. Существует также проверка для проверки целостности и обработки аватара, наряду с методом, который гарантирует, что не будет загружено изображение размером более 500 КБ.
Вам необходимо добавить avatar
, avatar_cache
и remove_avatar
в список доступных атрибутов. Это легко сделать — просто откройте файл application_controller.rb
и сделайте так:
« `rails app / controllers / application_controller.rb
Класс ApplicationController <ActionController :: Base # Предотвращает CSRF-атаки, вызывая исключение. # Для API вы можете использовать вместо этого: null_session. protect_from_forgery with:: исключение
before_action: configure_permitted_parameters, если:: devise_controller?
защищенный
def configure_permitted_parameters devise_parameter_sanitizer.for (: sign_up) {| u | u.permit (: имя пользователя,: электронная почта,: пароль,: подтверждение пароля,: Remember_me,: аватар,: avatar_cache)} devise_parameter_sanitizer.for (: account_update) {| u | u.permit (: имя пользователя,: пароль,: подтверждение пароля,: текущий_пароль,: аватар,: avatar_cache,: удалить_аватар)} end end « `
После этого вы готовы интегрировать CarrierWave
.
Настройка CarrierWave
Используя ваш текстовый редактор, перейдите к config/initializers
и создайте файл с именем carrier_wave.rb
. Вставьте код ниже:
rails ***config/initializers/carrier_wave.rb***
rails require 'carrierwave/orm/activerecord'
Это инициализатор, необходимый для загрузки CarrierWave после ActiveRecord.
Из вашего терминала сгенерируйте загрузчик:
rails rails generate uploader Avatar
Это создаст новый каталог с именем uploaders в папке приложения и файл внутри с именем avatar_uploader.rb
. Я отредактировал содержимое файла, чтобы оно выглядело так, как показано ниже:
« `рельсы
Приложение / закачивающие / avatar_uploader.rb
кодировка: utf-8
класс AvatarUploader <CarrierWave :: Uploader :: Base
включить CarrierWave :: MiniMagick
# Выберите, какой тип хранилища использовать для этого загрузчика: storage: fog
# Переопределить каталог, в котором будут храниться загруженные файлы. # Это разумное значение по умолчанию для загрузчиков, которые должны быть смонтированы: def store_dir «uploads / # {model.class.to_s.underscore} / # {mount_as} / # {model.id}» end
# Создайте разные версии ваших загруженных файлов: version: thumb do process: resize_to_fill => [100, 100] end
версия: средний процесс: resize_to_fill => [300, 300] конец
версия: small do process: resize_to_fill => [140, 140] конец
# Добавить белый список расширений, которые могут быть загружены. # Для изображений вы можете использовать что-то вроде этого: def extension_white_list% w (jpg jpeg gif png) end end « `
Вам нужна линия MiniMagick
для создания разных версий изображения. Я включил три версии изображений. MiniMagick делает возможным изменение размеров этой версии. Последний блок кода гарантирует, что никакие расширения файлов, кроме перечисленных здесь, не загружены.
Настройка AWS
В этом руководстве мы будем загружать наши изображения в Amazon Web Services . Если у вас еще нет учетной записи, перейдите на страницу регистрации и создайте бесплатную учетную запись.
Когда вы закончите с этим, вам нужно будет создать корзину для хранения ваших изображений. Когда там, выберите Create Bucket, чтобы открыть диалоговое окно. Введите имя для корзины и выберите регион. Когда закончите, выберите Создать .
Откройте ваш Gemfile, добавьте этот гем и bundle install
когда закончите.
rails gem 'figaro'
С вашего терминала запустите bundle exec figaro install
. Это создаст новый файл config/application.yml
и добавит его в .gitignore
вашего приложения. Этот файл необходим для обеспечения безопасности вашего идентификатора доступа AWS и секретного ключа.
Чтобы найти свой идентификатор доступа AWS и секретный ключ, перейдите в Amazon Web Services и нажмите на имя своей учетной записи, которое находится в правом углу консоли.
В раскрывающемся списке выберите « Учетные данные безопасности» и нажмите кнопку « Перейти к учетным данным безопасности» . На открывшейся странице выберите « Ключи доступа» (идентификатор ключа доступа и секретный ключ доступа) . Нажмите кнопку « Создать новый ключ доступа» , чтобы создать новый ключ и скопировать его в редактор.
В текстовом редакторе перейдите к config/application.yml
и вставьте следующее:
« `rails config / application.yml
aws_access_id: введите access_id здесь aws_access_secret_key: введите access_key здесь « `
Замените линии, как указано выше.
Перейдите к config/initializers
, создайте файл с именем storage.rb
и вставьте следующее:
« `rails config / initializers / storage.rb
CarrierWave.configure do | config | config.storage =: тумана tutsplus-avatar ”config.fog_public = false end` «
Согласно приведенному выше конфигу, область для моего сегмента — us-west-2
, а имя tutsplus-avatar
— tutsplus-avatar
. Замените это информацией о вашем ведре.
Запустите rails server
и укажите в браузере https://localhost:3000/users/sign_up
.
Настройка аватара по умолчанию
В вашем приложении вы можете установить аватар по умолчанию для пользователей, которые решили не загружать аватар. Делать это легко.
Создайте папку в app/assets/images
именем fallback
и поместите в нее изображение по умолчанию. Используя ваш текстовый редактор, перейдите в app/uploaders/avatar_uploader.rb
и вставьте следующий код:
« `rails app / uploaders / avatar_uploader.rb
def default_url (* args) ActionController :: Base.helpers.asset_path («fallback /» + [version_name, «default-avatar.gif»]. compact.join (‘_’)) end « `
Обязательно измените default-avatar.gif
на имя вашего изображения.
Вывод
Теперь вы знаете, как включить загрузку изображений для ваших пользователей. Это добавляет важную функцию к вашему приложению рельсов. Я надеюсь, тебе было весело. В следующей части мы рассмотрим PaperClip. Ваши отзывы приветствуются.