Exploring Devise, Del 1

I noen av mine tidligere artikler om bildeopplasting i Rails, gjorde jeg omtale av Devise, men gikk ikke dypt inn i den. I denne opplæringen vil jeg lære deg om Devise.

Klar? La oss komme i gang!

Avgjøre Introduksjon og Moduler

Devise er en autentiseringsløsning for Rails bygget med Warden og levert av de fantastiske menneskene på Plataformatec. Devise tilbyr forskjellige moduler:

Database Authenticatable: Dette krypterer og lagrer et passord til databasen for å validere ektheten til en bruker mens du logger på.
Omniauthable: Dette fester OmniAuth-støtte til Devise. Brukere av søknaden din vil kunne logge på ved hjelp av kontoer som Facebook, Twitter og Google.
Bekreftbar: Dette gjør det mulig å sende e-post med instruksjoner som vil hjelpe til med verifisering av en konto.
Gjenopprettbar: Denne modulen hjelper i tider når brukerne glemmer passordet og trenger å gjenopprette det. Med dette vil brukeren kunne tilbakestille passordet.
Registrerbar: Dette håndterer registrering av brukere. Det lar brukerne også redigere og slette sine kontoer.
Husk: Denne modulen gjør det mulig for din søknad å huske en innlogget bruker ved å lagre en informasjonskapsel.
Sporbar: Denne modulen hjelper med å spore innloggings telling, tidsstempler og IP-adresse.
Timeoutable: Denne modulen er ansvarlig for å utgå en økt som ikke har vært aktiv i en periode.
Validerbar: Med denne modulen, må e-post og passord bli validert.
Låsbar: Dette gir et ekstra lag med sikkerhet - når aktivert, kan en konto låses etter et gitt antall mislykkede påloggingsforsøk.

Devise Integration

For formålet med denne opplæringen, kommer vi til å generere et Rails-program som vi skal bruke for å sjekke ut arbeidet til Devise. La oss fortsette!

skinner nytt utfør-app -T

De -T flagg forteller Rails å generere programmet uten standard test suite. Naviger til søknadskatalogen din og slipp de følgende edelstenene i din Gemfile.

#Gemfile gem 'devise', '~> 4,1' perle 'bootstrap-sass', '~> 3,3'

Installer nå Devise og Bootstrap-edelstenene du nettopp har lagt til.

bunt installasjon

Gi nytt navn til din app / assets / stilark / application.css fil til app / assets / stilark / application.scss og legg til følgende linjer i den:

# app / assets / stylesheets / application.scss @ import "bootstrap-sprockets"; @import "bootstrap";

Åpne opp app / eiendeler / Javascript / application.js fil og krever bootstrap-tannhjul. Mine ser slik ut:

# app / assets / javascripts / application.js // = krever jquery // = krever bootstrap-kjetting // // krever jquery_ujs // = krever turbolinks // = require_tree .

Deretter må du kjøre kommandoen Rails for å installere konfigurasjonsfilene for Devise. Du gjør det ved å kjøre denne kommandoen:

skinner generere utforme: installere

Kommandoen genererer følgende på din terminal. Du bør lese det for å forstå hva som skjedde.

lage config / initializers / devise.rb opprett config / locales / devise.en.yml =============================== ========================================== Noen oppsett deg må gjøre manuelt hvis du ikke har ennå: 1. Kontroller at du har definert standard url-alternativer i miljøfilene dine. Her er et eksempel på default_url_options egnet for et utviklingsmiljø i config / environments / development.rb: config.action_mailer.default_url_options = vert: 'localhost', port: 3000 I produksjon, skal verten settes til den faktiske verten for din søknad. 2. Kontroller at du har definert root_url til * noe * i config / routes.rb. For eksempel: root til: "home # index" 3. Kontroller at du har flashmeldinger i app / visninger / layouts / application.html.erb. For eksempel: <%= notice %>
 <%= alert %>
 4. Hvis du bare distribuerer på Heroku med Rails 3.2, kan det hende du vil angi: config.assets.initialize_on_precompile = false På config / application.rb tvinger programmet ditt til ikke å få tilgang til DB- eller lastmodellene når du forkompilerer dine eiendeler. 5. Du kan kopiere Devise-visninger (for tilpasning) til appen din ved å kjøre: rails g devise: views ============================= ================================================== =

Kommandoen genererer også to filer, som du finner i config katalogen. Det gir oss også noen instruksjoner om hva vi skal gjøre.

Naviger til søknadslayouten din, app / visninger / oppsett / application.html.erb, og få det til å se ut som det jeg har under:

# App / visninger / oppsett / application.html.erb    DeviseApp <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => ekte%> <%= javascript_include_tag 'application', 'data-turbolinks-track' => ekte%> <%= csrf_meta_tags %>    <%= notice %>
 <%= alert %>
 
  <%= yield %>

Du må definere standard nettadressevalg for utviklingsmiljøet ditt. Legg til koden nedenfor i konfig / miljøer / development.rb.

# config / environments / development.rb config.action_mailer.default_url_options = vert: 'localhost', port: 3000

Nå må du opprette en Bruker modell for Devise. Du kan gjøre det ved å bruke terminalen din.

skinner genererer utvikle bruker

Dette vil generere en user.rb filen i din app / modeller katalogen. Den genererte filen vil se slik ut:

klassen bruker < ActiveRecord::Base # Include default devise modules. Others available are: # :confirmable, :lockable, :timeoutable and :omniauthable devise :database_authenticatable, :registerable, :recoverable, :rememberable, :trackable, :validatable end

Du kan se at den inneholder standardmodulene jeg nevnte ovenfor. Kommandoen du løp endret også din config / routes.rb fil ved å legge til en rute for å utarbeide. Du bør sjekke det ut.

På dette tidspunktet må du migrere databasen din. Du gjør det ved å kjøre:

rake db: migrere

Autentisering ved hjelp av Devise

Nå må du opprette en PagesController og pakk Devise-godkjenning rundt det - dette forhindrer uautoriserte personer i å se siden.

skinner genererer kontroller Sider indeks

Åpne ruteplanen din og sett inn roten til søknaden din.

# config / routes.rb Rails.application.routes.draw gjør devise_for: brukere rot til: "sider # index" slutten

Åpne opp din PagesController og legg til godkjenning for din index og ny sider.

# app / controllers / pages_controller.rb klasse PagesController < ApplicationController before_action :authenticate_user!, only: [:index, :new] def index end def new end end

Koden viser at index og ny sider er kun tilgjengelige for registrerte brukere. Åpne opp terminalen din og start din skinner server. Pek nettleseren din til http: // localhost: 3000 og du blir automatisk omdirigert til Devise-påloggingssiden.

Logg på uten å bruke e-post

Standardinnretningen for å logge på Devise innebærer bruk av e-postadresse og passord. Hva om du vil aktivere brukerne å logge på med sitt unike brukernavn? Hvis det er det du vil, er det mulig. La oss se hvordan.

Kjør kommandoen:

skinner genererer migrasjon AddUsernameToUSers brukernavn: streng

Dette vil legge til en ny kolonne for brukernavn i din brukere bord. Overfør databasen din.

rake db: migrere

Du må legge til et felt i visningene dine der brukerne kan skrive inn brukernavnet. Når du går til din app / visninger katalog, vil du ikke finne noen filer som gjør visningen av Devise. Dette skyldes at Devise laster visningene fra sin gemset. For å tilpasse det må du generere kopier av visningene. Kommandoen nedenfor gjør det magiske.

skinner genererer utforme: visninger

Dette vil generere noen mapper og filer i din app / visninger katalog.

Du må redigere siden for å logge på, registrere deg og oppdatere brukerinformasjon. Bare lim inn blokkene med kode nedenfor i deres respektive filer.

Melde deg på

# App / visninger / tenke / registreringer / new.html.erb Melde deg på
 <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %> <%= devise_error_messages! %>  <%= f.label :email %>
 <%= f.email_field :email, autofocus: true, class: "form-control" %> 
  <%= f.label :username %> <%= f.text_field :username, class: "form-control" %> 
  <%= f.label :password %> <% if @minimum_password_length %> (<%= @minimum_password_length %> tegn minimum) <% end %>
 <%= f.password_field :password, autocomplete: "off", class: "form-control" %> 
  <%= f.label :password_confirmation %>
 <%= f.password_field :password_confirmation, autocomplete: "off", class: "form-control" %> 
  <%= f.submit "Sign up", class: "btn btn-primary" %> 
 <% end %> <%= render "devise/shared/links" %>

Redigere

# App / visninger / tenke / registreringer / edit.html.erb Redigere <%= resource_name.to_s.humanize %>
 <%= form_for(resource, as: resource_name, url: registration_path(resource_name), html:  method: :put ) do |f| %> <%= devise_error_messages! %>  <%= f.label :email %>
 <%= f.email_field :email, autofocus: true, class: "form-control" %> 
 <% if devise_mapping.confirmable? && resource.pending_reconfirmation? %> For tiden venter bekreftelse på: <%= resource.unconfirmed_email %>
 <% end %>  <%= f.label :username %> <%= f.text_field :username, class: "form-control" %> 
  <%= f.label :password %> (la være tom hvis du ikke vil endre den)
 <%= f.password_field :password, autocomplete: "off", class: "form-control" %> 
  <%= f.label :password_confirmation %>
 <%= f.password_field :password_confirmation, autocomplete: "off", class: "form-control" %> 
  <%= f.label :current_password %> (vi trenger ditt nåværende passord for å bekrefte endringene dine)
 <%= f.password_field :current_password, autocomplete: "off", class: "form-control" %> 
  <%= f.submit "Update", class: "btn btn-primary" %> 
 <% end %> Avbryt kontoen min
 Ulykkelig? <%= button_to "Cancel my account", registration_path(resource_name), data:  confirm: "Are you sure?" , method: :delete %>
 <%= link_to "Back", :back %>

Logg inn

# App / visninger / tenke / økter / new.html.erb Logg Inn
 <%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %>  <%= f.label :username %>
 <%= f.text_field :username, autofocus: true, class: "form-control" %> 
  <%= f.label :password %>
 <%= f.password_field :password, autocomplete: "off", class: "form-control" %> 
 <% if devise_mapping.rememberable? -%>  <%= f.check_box :remember_me %> <%= f.label :remember_me %> 
 <% end -%>  <%= f.submit "Log in", class: "btn btn-primary" %> 
 <% end %> <%= render "devise/shared/links" %>

Bruk tekstredigeringsprogrammet til å navigere til app / kontrollere / application_controller.rb. Du må endre den for å tillate bruk av brukernavn. Endre det slik at det ser ut som dette:

# app / controllers / application_controller.rb klasse ApplicationController < ActionController::Base # Prevent CSRF attacks by raising an exception. # For APIs, you may want to use :null_session instead. protect_from_forgery with: :exception before_action :configure_permitted_parameters, if: :devise_controller? protected def configure_permitted_parameters added_attrs = [:username, :email, :password, :password_confirmation, :remember_me] devise_parameter_sanitizer.permit :sign_up, keys: added_attrs devise_parameter_sanitizer.permit :account_update, keys: added_attrs end end

Nå kan en bruker logge på med sitt brukernavn. På dette punktet er det noe som ikke stemmer med søknaden din. Når en bruker logger inn, er det ikke mulig å logge ut. Dette resulterer ikke i en flott brukeropplevelse. Jeg skal vise deg hvordan du kan fikse det.

Fra din terminal, opprett en ny katalog som heter delt i din app / visninger mappe.

mkdir app / visninger / delt berøringsapp / visninger / delt / _navigation.html.erb

Filen du opprettet ovenfor er delvis hvor koden for navigasjonslinjen din vil bli skrevet. Slett i følgende kode.

# App / visninger / delt / _navigation.html.erb    <%= link_to 'Tutsplus Devise', root_path, class: 'navbar-brand' %> 
   <%= link_to 'Home', root_path %>
 
  <% if user_signed_in? %>   <%= current_user.name %>    <%= link_to 'Profile', edit_user_registration_path %>
 <%= link_to 'Log out', destroy_user_session_path, method: :delete %>
 
 
 <% else %> <%= link_to 'Log In', new_user_session_path %>
 <%= link_to 'Sign Up', new_user_registration_path %>
 <% end %>

Nå må du gjøre navigasjonsfeltet i programoppsettet ditt. Åpne opp app / visninger / oppsett / application.html.erb og slipp koden for å gjengi navigasjonslinjen.

# App / visninger / oppsett / application.html.erb ...  <%= render "shared/navigation" %> <%= notice %>
 <%= alert %>
 
...

Konklusjon

I denne delen lærte du å installere Devise og legge til godkjenning på sidene dine. Jeg nevnte også en delvis. Jeg vil dekke det i en egen opplæring.

I neste del skal vi dekke noen områder som er mer avanserte enn dette. Jeg håper dette var verdt tiden din!

Kode