TOC

Как настроить Devise и OmniAuth для вашего Rails-приложения

Вступление

Большинство приложений Ruby on Rails требуют регистрации пользователей и механизмов аутентификации. Разработка их с нуля требует много времени и усилий - к счастью, есть * Devise *. Используя гем Devise, вы можете за считанные минуты настроить полноценную систему аутентификации пользователей.

Однако вы можете сделать своих пользователей счастливее, предоставив им доступ к вашему приложению без создания новой учетной записи. Они могут просто войти в систему, используя свои существующие учетные записи Facebook, Twitter, Amazon или DigitalOcean. Фактически, вы можете поддерживать аутентификацию у любого популярного поставщика услуг OAuth. Поддержка OAuth обеспечивается самоцветом OmniAuth. В этом уроке мы создадим простое приложение, которое использует Devise и OmniAuth.

Предпосылки

Прежде чем начать, убедитесь, что на вашем хосте установлены последние версии RVM, Ruby и Rails. Если вы этого не сделаете, пожалуйста, следуйте инструкциям здесь: https://www.digitalocean.com/community/tutorials/how-to-install-ruby-on-rails-on-ubuntu-12-04-lts-precise- pangolin-with-rvm [Как установить Ruby on Rails в Ubuntu 12.04 LTS с RVM]

Этот учебник был протестирован с Ruby 2.1.2 и Rails 4.1.5.

Шаг 1 - Создайте новое приложение Rails

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

Вы должны создать его сейчас.

mkdir rails_apps
cd rails_apps

Вы должны инициализировать среду RVM перед тем, как начинать вводить команды Rails.

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

. ~/.rvm/scripts/rvm
rvm use ruby --default

Давайте назовем новое приложение * myapp *. После создания приложения используйте для входа в базовый каталог приложения.

rails new myapp
cd myapp

  • Примечание: все команды Rails должны запускаться из директории вашего приложения, которая в этом случае ~ / rails_apps / myapp. *

Шаг 2 - Добавьте необходимые драгоценные камни в Gemfile

Нам понадобятся драгоценные камни Devise и OmniAuth. Кроме того, вам также понадобится отдельный гем для каждого поставщика услуг OAuth, которого вы хотите поддерживать. Для этого урока мы будем поддерживать вход в систему с помощью DigitalOcean, поэтому нам нужен гем.

Добавьте следующие строки в конец файла + ~ / rails_apps / myapp / Gemfile +. Вы можете использовать в качестве вашего текстового редактора.

gem 'therubyracer'
gem 'devise'
gem 'omniauth'
gem 'omniauth-digitalocean'

Вам понадобятся аналогичные камни для поддержки других поставщиков. Например, для поддержки Facebook вам понадобится. Вот несколько таких драгоценных камней для вашей справки:

  • Твиттер - omniauth-twitter

  • Амазонка - омниаут-амазонка

  • Google - omniauth-google

  • Github - omniauth-github

Установите недавно добавленные драгоценные камни.

bundle install

Шаг 3 - Добавить базовую функциональность в приложение

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

Для этого мы можем использовать функцию лесов Rails. Используя команду, мы просто указываем детали о модели, а Rails генерирует полнофункциональные страницы для выполнения операций CRUD (Create Read Update Delete) с этой моделью. Другими словами, все связанные контроллеры и представления генерируются вместе с файлом модели.

rails g scaffold Product name:string price:integer description:text
rake db:migrate

Далее мы должны определить корень этого приложения.

Отредактируйте + ~ / rails_apps / myapp / config / rout.rb + и добавьте строку + root 'products # index' +, чтобы указать корень приложения, чуть ниже существующей строки. Вы можете игнорировать все закомментированные строки. Когда вы закончите, активные строки в файле будут выглядеть так:

Rails.application.routes.draw do
 resources :products

end

Идите, протестируйте ваше приложение сейчас. Запустите сервер разработки, введя:

rails s

Посетите localhost из вашего браузера. Если вы разрабатываете удаленно, замените * localhost * на соответствующий IP-адрес или домен для вашей Droplet. * 3000 * - номер порта по умолчанию для сервера разработки.

На данный момент, вход в систему не требуется. Добавьте пару продуктов, нажав «Новый продукт». Как только вы убедитесь, что ваше приложение работает должным образом, вернитесь к терминалу и нажмите Ctrl + C, чтобы остановить сервер.

Шаг 4 - Настройка устройства

Введите следующие команды, чтобы добавить поддержку аутентификации Devise.

rails generate devise:install
rails generate devise User
rake db:migrate

Это добавляет формы входа и регистрации, а также всю связанную логику.

Наше приложение теперь имеет базовую систему аутентификации, где пользователи могут зарегистрироваться, а затем войти в систему. Тем не менее, все страницы по-прежнему доступны напрямую. Чтобы изменить это, отредактируйте + ~ / rails_apps / myapp / app / controllers / application_controller.rb + и добавьте в качестве действия, которое необходимо выполнить перед обслуживанием любой страницы.

class ApplicationController < ActionController::Base
 protect_from_forgery with: :exception

end

Если вы хотите, вы можете снова запустить сервер разработки с помощью команды и проверить эти недавно добавленные страницы, посетив + http: //: 3000 / + (опять же, используйте свой собственный домен или IP-адрес). Вы должны увидеть страницу, которая выглядит следующим образом:

изображение: https: //assets.digitalocean.com/articles/Configure_Devise/1.jpg [Страница входа]

Вы можете зарегистрироваться как новый пользователь, посетив + http: // localhost: 3000 / users / sign_up +.

Шаг 5 - Обновите модель пользователя для поддержки OmniAuth

Если вы снова запустили сервер, остановите его с помощью CTRL-C. Добавьте новый столбец, вызываемый в модель, созданную Devise.

rails g migration AddColumnsToUsers provider uid
rake db:migrate

Шаг 6 - Получить идентификатор клиента и секрет клиента от поставщика услуг OAuth

Посетите веб-сайт поставщика услуг и зарегистрируйте там свою заявку. Все поставщики услуг имеют различные процедуры регистрации. Для DigitalOcean, обратитесь к учебнику здесь: How To Use OAuth-аутентификация с DigitalOcean как пользователь или разработчик

Вам будет предложено для URL обратного вызова во время процесса регистрации. Для каждого провайдера существует отдельный URL-адрес обратного вызова. Вот URL-адреса обратного вызова для нескольких популярных поставщиков услуг:

  • Цифровой океан: http: //: 3000 / users / auth / digitalocean / callback

  • Facebook: http: //: 3000 / users / auth / facebook / callback

  • Amazon: http: //: 3000 / users / auth / amazon / callback

  • Twitter: http: //: 3000 / users / auth / twitter / callback

  • Google: http: //: 3000 / users / auth / google / callback

Пожалуйста, замените * localhost * IP-адресом или доменом, который разрешается в вашей Droplet. В конце процесса регистрации вам будет предоставлен ваш идентификатор клиента и секрет клиента. Вы будете использовать эти значения на следующем шаге.

Шаг 7 - Обновите инициализатор Devise

Отредактируйте + ~ / rails_apps / myapp / config / initializers / devise.rb +, чтобы добавить идентификаторы и секреты клиента в нижней части файла, непосредственно перед строкой + end +. Также неплохо обновить что-то, что имеет имя и имя вашего собственного сервера. Вам не нужно вносить какие-либо другие изменения, кроме этих двух пунктов.

После редактирования ваш файл будет выглядеть следующим образом (в файле также будет много закомментированных строк):

Devise.setup do |config|
 #Replace example.com with your own domain name
 config.mailer_sender =

 require 'devise/orm/active_record'
 config.case_insensitive_keys = [ :email ]
 config.strip_whitespace_keys = [ :email ]
 config.skip_session_storage = [:http_auth]
 config.stretches = Rails.env.test? ? 1 : 10
 config.reconfirmable = true
 config.expire_all_remember_me_on_sign_out = true
 config.password_length = 8..128
 config.reset_password_within = 6.hours
 config.sign_out_via = :delete

 #Add your ID and secret here
 #ID first, secret second

end

Шаг 8 - Обновите модель пользователя

Модель пользователя, созданную Devise, должна быть изменена, чтобы указать поставщиков услуг, которые мы хотим использовать. Мы добавляем три элемента в существующий список (*: omniauthable,: omniauth_providers ⇒ [: digitalocean] * и не забывайте лишнюю запятую!). Мы также создаем новый метод с именем для извлечения информации, которая доступна после аутентификации.

После его редактирования ваш + ~ / rails_apps / myapp / app / models / user.rb + должен выглядеть так:

class User < ActiveRecord::Base
 devise :database_authenticatable, :registerable,
        :recoverable, :rememberable, :trackable, :validatable,
    :omniauthable, :omniauth_providers => [:digitalocean]

 def self.from_omniauth(auth)
     where(provider: auth.provider, uid: auth.uid).first_or_create do |user|
       user.provider = auth.provider
       user.uid = auth.uid
       user.email = auth.info.email
       user.password = Devise.friendly_token[0,20]
     end
 end
end

Сохраните файл.

Шаг 9 - Добавьте контроллер для обработки URL-адресов обратного вызова

Сначала отредактируйте + ~ / rails_apps / myapp / config / rout.rb + и обновите строку, указав имя контроллера, который будет обрабатывать обратные вызовы. Давайте просто назовем это «обратными вызовами». Ваш файл должен выглядеть следующим образом (за исключением закомментированных разделов):

Rails.application.routes.draw do
 devise_for :users
 resources :products
 root 'products#index'
end

Затем создайте новый файл + ~ / rails_apps / myapp / app / controllers / callbacks_controller.rb +.

Добавьте следующий код к нему:

class CallbacksController < Devise::OmniauthCallbacksController
   def digitalocean
       @user = User.from_omniauth(request.env["omniauth.auth"])
       sign_in_and_redirect @user
   end
end

Если вы использовали больше поставщиков OAuth, вам потребуется отдельный метод для каждого из них. Имя метода должно соответствовать имени провайдера. Например, чтобы добавить поддержку Facebook, ваш метод будет определен с помощью.

Ваша заявка готова. Запустите ваш сервер снова:

rails s

Посетите вашу домашнюю страницу. Поскольку мы тестируем функцию входа в систему, вы можете сделать это в сеансе без сохраненных данных, например в окне Chrome Incognito. Вы должны увидеть ссылку * Войти через Digitalocean *. Нажмите здесь. Вы должны быть перенаправлены на страницу входа в систему DigitalOcean. После успешного входа в систему вы будете перенаправлены обратно в собственное приложение, и отобразится страница продуктов.

изображение: https: //assets.digitalocean.com/articles/Configure_Devise/2.jpg [Войти в систему с помощью DigitalOcean]

Заключение

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

Если вы когда-нибудь решите взять это приложение для производства на Droplet, вы можете обратиться к учебнику здесь: https://www.digitalocean.com/community/tutorials/how-to-launch-your-ruby-on-rails- app-with-the-digitalocean-one-click-image [Как запустить приложение Ruby on Rails с изображением DigitalOcean One Click Image]. Если вы добавляете свое приложение в новую Droplet, не забудьте вернуться к шагу 6, чтобы обновить настройки API DigitalOcean с URL-адресами обратного вызова вашего производственного сервера.

Related