În acest tutorial, veți învăța cum să permiteți utilizatorilor aplicației dvs. să se conecteze utilizând contul lor Twitter. Acest lucru a fost făcut ușor cu instrumente cum ar fi OAuth.

Veți folosi OmniAuth-Twitter, care conține strategia Twitter pentru OmniAuth.

Hai să ne aruncăm!

Noțiuni de bază

Începeți prin generarea aplicației Rails. Din terminalul dvs., executați comanda pentru a face acest lucru:

șine noi Tuts-Social -T 

Deschideți fișierul Gem și adăugați bijuteria pentru bootstrap.

# Gemfile ... bijuterie "bootstrap-sass"

Instalați bijuteria executând comanda:

instalare pachet

Redenumiți app / active / stylesheets / application.css la app / active / application.scs / foi de stil.

Când ați terminat, adăugați următoarele linii de cod pentru a importa bootstrap.

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

Creați un nume parțial _navigation.html.erb să țineți codul dvs. de navigare; partea parțială ar trebui să fie situată în app / views / dispuneri director.

Introduceți codul de mai jos într-un IDE. Utilizează Bootstrap pentru a crea o bară de navigare pentru aplicația dvs..

# App / opinii / machete / _navigation.html.erb 

Pentru ca navigația să fie utilizată, trebuie să o redați în aspectul aplicației. Ajustați aspectul aplicației dvs. pentru a arăta cum am spus mai jos.

# App / opinii / machete / application.html.erb     <%= csrf_meta_tags %> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>   <%= render "layouts/navigation" %> 
 <% flash.each do |key, value| %> 
<%= value %>
 <% end %> 
 
 <%= yield %> 
  

Generează a PagesController cu o acțiune de indexare prin introducerea comenzii de mai jos în terminalul dvs..

rails generat controler Index pagini

În vizualizările index generate, editați-le pentru a arăta astfel.

# App / opinii / pagini / index.html.erb 
 
Bine ați venit la Tuts Social!
 
Mulțumesc că ne-ai verificat!
 

În codul de mai sus, folosim o clasă numită Jumbotron-aceasta este o componentă Bootstrap care ne permite să extindem fereastra de vizualizare pentru a prezenta un mesaj de marketing. Puteți afla mai multe despre aceasta din documentația Bootstrap.

Deschideți fișierul rutelor pentru a vă adăuga root_path.

# config / routes.rb Rails.application.routes.draw do # Pentru detalii despre DSL disponibil în acest fișier, consultați http://guides.rubyonrails.org/routing.html root la: "pages # index" end

Configurarea OmniAuth-Twitter

Trebuie să creați o nouă aplicație Twitter. Accesați această pagină în paginile dezvoltatorului Twitter pentru a crea una. Introduceți toate detaliile necesare, similare cu ceea ce am în ecranul de mai jos.

Pentru adresa URL de apel invers, introduceți adresa site-ului dvs. web plus "auth / twitter / callback". Dacă se întâmplă să se afle într-o mașină locală, URL-ul dvs. de apel invers ar trebui să fie următorul: http://127.0.0.1:3000/auth/twitter/callback. 

Veți fi redirecționat către pagina de informații a aplicației pe Twitter. Navigați la Cheile și accesoriile pentru a obține cheile. Copiați cheia de consum și secretul consumatorilor și le lipiți într-un loc sigur - le vom folosi în scurt timp.

Adresa URL de apel invers este adresa URL la care un utilizator va fi redirecționat în interiorul aplicației după autentificarea reușită și autorizația autorizată (cererea va conține, de asemenea, datele și tokenul utilizatorului). Toate strategiile OmniAuth se așteaptă ca URL-ul apelului de apel să fie egal cu "/ auth /: provider / callback". : furnizor ia numele strategiei. În acest caz, strategia va fi "twitter" așa cum veți enumera în inițializator.

Deschide-ți Gemfile pentru a adăuga omniauth-twiiter bijuterie.

# Gemfile ... bijuterie "omniauth-twitter"

Acum creați un inițializator pentru OmniAuth în directorul config / initializers. Aceasta va menține configurația pentru OmniAuth. Faceți-o să arate cum am mai jos.

# config / initializers / omniauth.rb Rails.application.config.middleware.use OmniAuth :: Furnizor de servicii de constructor: twitter, ENV ['TWITTER_KEY'], ENV ['TWITTER_SECRET'] sfârșit

În acest moment, va trebui să utilizați cheile și jetoanele de acces pe care le-ați stocat în siguranță. Trebuie să le păstrați în siguranță, deoarece nu doriți să le împingeți la un depozit public atunci când vă comiteți codul.

Veți folosi o bijuterie pentru acest lucru. Deschideți din nou Gemul dvs. și adăugați bijuteria de mai jos. Adăugați-l la Gemfile dvs. așa cum este acesta:

# Gemfile ... grup: dezvoltare,: test do ... gem 'dotenv-rails' ... 

Pentru a instala bijuteria, rulați.

instalare pachet

În directorul de acasă al aplicației, creați un fișier numit .env.

Deschideți-l și adăugați cheile și jetoanele după cum urmează:

# .inv TWITTER_KEY = xxxxxxxxxxxxxx TWITTER_SECRET = xxxxxxxxxxxxxx

Deschis .gitignore și adăugați fișierul pe care tocmai l-ați creat.

# .gitignore ... # Ignore .env utilizat pentru stocarea cheilor și a jetoanelor de acces .env

Cu aceasta, cheile și jetoanele de acces sunt sigure! Pentru a afla mai multe despre modul de utilizare dotenv-șine, consultați pagina GitHub.

Este timpul să lucrați pe traseul dvs. Deschideți fișierul de rute și adăugați ruta de mai jos.

# config / routes.rb ... get '/ auth /: provider / callback', la: 'sessions # create'

Trebuie să adăugați linkul pentru conectarea Twitter la navigarea dvs. Deschideți fișierul de navigare și modificați-l pentru a arăta astfel.

Din cele de mai sus, doriți să afișați linkul pentru a vă conecta cu Twitter numai atunci când utilizatorul nu este conectat.

Crearea sesiunilor

Veți avea nevoie de un controler de sesiune pentru a gestiona conectarea utilizatorilor. Creați un fișier pentru acesta din directorul controlerelor; așa ar trebui să arate.

Acțiunea de creare ajută la crearea unei sesiuni pentru utilizatori, astfel încât aceștia să poată fi conectați la aplicația dvs. Fără aceasta, utilizatorii nu au niciun mijloc de conectare.

# app / controllers / sessions_controller.rb Clasa SessionsController < ApplicationController def create @user = User.find_or_create_from_auth_hash(auth_hash) session[:user_id] = @user.id redirect_to root_path end protected def auth_hash request.env['omniauth.auth'] end end

Veți avea nevoie de a utilizator curent la acest punct. Acest lucru vă va ajuta să verificați dacă un utilizator este conectat sau dezactivat.

Deschis app / controlere / application_controller.rb și adăugați următoarele.

# app / controllers / application_controller.rb ... def actual_user @current_user || = User.find (sesiune [: user_id]) dacă sesiunea [: user_id] termină helper_method: current_user ... 

Modelul utilizatorului

Acum, generați un model pentru utilizatorii dvs. Rulați comanda pentru a face acest lucru.

rails generat modoel Furnizor de utilizator: string uid: nume șir: token șir: string secret: string profil_image: șir

Aceasta ar trebui să genereze un fișier de migrare care arată astfel.

# xxxxxx_create_users.rb clasă CreateUsers < ActiveRecord::Migration[5.0] def change create_table :users do |t| t.string :provider t.string :uid t.string :name t.string :token t.string :secret t.string :profile_image t.timestamps end end end

Acum migrați baza de date rulând:

rake db: migrați

Deschideți modelul dvs. de utilizator și faceți ca acesta să arate astfel:

# app / models / user.rb Utilizator de clasă < ApplicationRecord def self.find_or_create_from_auth_hash(auth_hash) user = where(provider: auth_hash.provider, uid: auth_hash.uid).first_or_create user.update( name: auth_hash.info.nickname, profile_image: auth_hash.info.image, token: auth_hash.credentials.token, secret: auth_hash.credentials.secret ) user end end

Codul de mai sus stochează unele informații care aparțin utilizatorului. Aceasta include numele, profilul_imaginii, token și secretul utilizatorului. Dacă cererea dumneavoastră necesită mai mult decât atât, puteți verifica pagina OmniAuth-Twitter.

Ștergerea sesiunilor

În aplicația dvs., doriți să oferiți utilizatorilor posibilitatea de a vă deconecta. Veți avea nevoie de a distruge acțiune în dvs. SessionsController pentru ca aceasta să funcționeze. Apoi, se va adăuga un link la navigarea dvs..

Adaugă distruge acțiune pentru dvs. SessionsController.

# app / controllers / sessions_controller.rb ... def distruge dacă current_user session.delete (: user_id) flash [: success] = "S-au deconectat de succes!" finalizați redirect_to sfîrșitul trasei ... 

Apoi adăugați acest link pentru a vă conecta la navigația dvs., astfel încât navigarea dvs. să arate astfel.

# App / opinii / machete / _navigation.html.erb 

Deschideți config / routes.rb pentru a vă actualiza traseele cu acțiunea pe care tocmai ați creat-o.

# config / routes.rb ... ștergeți '/ logout', la: 'sessions # destroy' ... 

Porniți serverul de șine și îndreptați browserul spre http: // localhost: 3000 pentru a vedea ce aveți.

Concluzie

În acest tutorial ați învățat cum să activați OmniAuth-Twitter în aplicația Rails. Ați văzut cum să obțineți datele utilizatorilor utilizând OmniAuth-Twitter, pe care ați făcut-o în modelul dvs. de utilizator. Ai reușit să creezi SessionControllers pentru a gestiona conectarea și ieșirea de la utilizatori din aplicația dvs..

Sper ca ti-a placut. În viitor, veți vedea cum să faceți același lucru pentru Facebook, Google și LinkedIn.