SlideShare una empresa de Scribd logo
1 de 17
Descargar para leer sin conexión
Login Social con Node.js Comunidad Mejorando.la
Login social con Node.js
Gestión de usuarios con PassportJS
Login Social con Node.js Comunidad Mejorando.la
¿Qué es PassportJS?
Middleware de autenticación para Node.js, que
facilita la autenticación y registro de
usuarios de una aplicación web.
http://passportjs.org
Login Social con Node.js Comunidad Mejorando.la
¿Qué necesitamos?
● Instalar Node.js
http://nodejs.org/download/
● Instalar MongoDB
https://www.mongodb.org/downloads
Login Social con Node.js Comunidad Mejorando.la
¡Comenzamos!
Creamos una estructura base de aplicación con el
framework Express
Instalamos las dependencias que vamos a utilizar
$ sudo npm install -g express
$ express passport-example
$ cd passport-example
$ npm install
$ npm install --save mongoose
$ npm install --save passport
$ npm install --save passport-twitter
$ npm install --save passport-facebook
Login Social con Node.js Comunidad Mejorando.la
Modelo usuario
models/user.js
var mongoose = require('mongoose');
var Schema = mongoose.Schema;
var UserSchema = new Schema({
name: String,
provider: String,
provider_id: {type: String, unique: true},
photo: String,
createdAt: {type: Date, default: Date.now}
});
var User = mongoose.model('User', UserSchema);
Login Social con Node.js Comunidad Mejorando.la
Configuración de Passport
passport.js
var mongoose = require('mongoose');
var User = mongoose.model('User');
var TwitterStrategy = require('passport-twitter').Strategy;
var FacebookStrategy = require('passport-facebook').Strategy;
module.exports = function(passport) {
passport.serializeUser(function(user, done) {
done(null, user);
});
passport.deserializeUser(function(obj, done) {
done(null, obj);
});
. . .
Login Social con Node.js Comunidad Mejorando.la
Configuración de Passport
(Twitter)
passport.js
. . .
passport.use(new TwitterStrategy({
consumerKey: 'TWITTER_CONSUMER_KEY',
consumerSecret: 'TWITTER_CONSUMER_SECRET',
callbackURL: '/auth/twitter/callback'
}, function(accessToken, refreshToken, profile, done) {
User.findOne({provider_id: profile.id}, function(err, user) {
if(err) throw(err);
if(!err && user!= null) return done(null, user);
var user = new User({
provider_id: profile.id,
provider: profile.provider,
name: profile.displayName,
photo: profile.photos[0].value
});
user.save(function(err) {
if(err) throw err;
done(null, user);
});
});
}));
Login Social con Node.js Comunidad Mejorando.la
Configuración de Passport
(Facebook)
passport.js
. . .
passport.use(new FacebookStrategy({
clientID: 'FACEBOOK_APP_CLIENT_ID',
clientSecret: 'FACEBOOK_APP_SECRET_ID',
callbackURL: '/auth/twitter/callback'
}, function(accessToken, refreshToken, profile, done) {
User.findOne({provider_id: profile.id}, function(err, user) {
if(err) throw(err);
if(!err && user!= null) return done(null, user);
var user = new User({
provider_id: profile.id,
provider: profile.provider,
name: profile.displayName,
photo: profile.photos[0].value
});
user.save(function(err) {
if(err) throw err;
done(null, user);
});
});
}));
Login Social con Node.js Comunidad Mejorando.la
Mantener las API KEYs apartadas
del código fuente
config.js passport.js
. . .
var config = {
twitter: {
key: ‘TWITTER_API_KEY’,
secret: ‘TWITTER_API_SECRET’
},
facebook: {
id: ‘FACEBOOK_APP_ID’,
secret: ‘FACEBOOK_APP_SECRET’
}
};
module.exports = config;
var config = require(‘./config’);
. . .
passport.use(new TwitterStrategy({
consumerKey: 'config.twitter.key',
consumerSecret: 'config.twitter.secret',
callbackURL: '/auth/twitter/callback'
. . .
passport.use(new FacebookStrategy({
clientID: 'config.facebook.id',
clientSecret: 'config.facebook.secret',
callbackURL: '/auth/twitter/callback'
. . .
Login Social con Node.js Comunidad Mejorando.la
Conjuntando todo
app.js
...
var mongoose = require('mongoose');
var passport = require('passport');
require('./models/user');
require('./passport')(passport);
mongoose.connect('mongodb://localhost/passport-example',
function(err, res) {
if(err) throw err;
console.log('Conectado con éxito a la BD');
});
…
app.use(express.cookieParser());
app.use(express.urlencoded());
app.use(express.json());
app.use(express.methodOverride());
app.use(express.session({ secret: 'secretkey' }));
// Configuración de Passport
app.use(passport.initialize());
app.use(passport.session());
...
// Rutas de Passport
app.get('/logout', function(req, res) {
req.logout();
res.redirect('/');
});
app.get('/auth/twitter', passport.authenticate
('twitter'));
app.get('/auth/facebook', passport.authenticate
('facebook'));
app.get('/auth/twitter/callback', passport.
authenticate('twitter',
{ successRedirect: '/',
failureRedirect: '/login' }));
app.get('/auth/facebook/callback', passport.
authenticate('facebook',
{ successRedirect: '/',
failureRedirect: '/login' }));
...
Login Social con Node.js Comunidad Mejorando.la
Registro de App en FB/TW
Acceder a la sección “Desarrolladores” de Facebook y Twitter para registrar
una App y adquirir un API Key y un API Secret
http://dev.twitter.com http://developers.facebook.com
Login Social con Node.js Comunidad Mejorando.la
Obtención de API Keys
(Twitter)
Login Social con Node.js Comunidad Mejorando.la
Obtención de API Keys
(Facebook)
Login Social con Node.js Comunidad Mejorando.la
Controlador de la vista principal
routes/index.js
Le indicamos que variables queremos que se visualicen en el HTML
views/index.jade
exports.index = function(req, res){
res.render('index', {
title: 'Passport-Example',
user: req.user
});
};
if(user)
ul
li
img(src="#{user.photo}")
li Bienvenido #{user.name}
li
a(href='logout') Salir
else
ul
li
a(href='auth/twitter') Login con Twitter
li
a(href='auth/facebook') Login con Facebook
Login Social con Node.js Comunidad Mejorando.la
¡Y voilá!
Código disponible en:
http://github.com/carlosazaustre/passportjs-example
$ mongod &
$ node app.js
Login Social con Node.js Comunidad Mejorando.la
¡Gracias!
Carlos Azaustre
Desarrollador Web / JavaScript Lover / MOOC Addict / Based in Madrid,Spain
carlosazaustre.es/blog
@carlosazaustre
/carlosazaustre.web
/carlosazaustre
/+CarlosAzaustre
Login Social con Node.js Comunidad Mejorando.la
Preguntas

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

AngularJS 1 - A Superheroic Javascript MVC framework (Spanish)
AngularJS 1 - A Superheroic Javascript MVC framework (Spanish)AngularJS 1 - A Superheroic Javascript MVC framework (Spanish)
AngularJS 1 - A Superheroic Javascript MVC framework (Spanish)
 
Despegar Tech Talk - AngularJS
Despegar Tech Talk - AngularJSDespegar Tech Talk - AngularJS
Despegar Tech Talk - AngularJS
 
Por qué AngularJS
Por qué AngularJSPor qué AngularJS
Por qué AngularJS
 
Taller de Angular JS: La solución tecnológica perfecta
Taller de Angular JS: La solución tecnológica perfectaTaller de Angular JS: La solución tecnológica perfecta
Taller de Angular JS: La solución tecnológica perfecta
 
Introduccion a AngularJS
Introduccion a AngularJSIntroduccion a AngularJS
Introduccion a AngularJS
 
Introducción a Angular JS
Introducción a Angular JSIntroducción a Angular JS
Introducción a Angular JS
 
Angularjs
AngularjsAngularjs
Angularjs
 
Angular js
Angular jsAngular js
Angular js
 
Angular js
Angular jsAngular js
Angular js
 
Angular js in mobile
Angular js in mobileAngular js in mobile
Angular js in mobile
 
Angular 2 is Coming - GDG DevFest Cordoba 2015
Angular 2 is Coming - GDG DevFest Cordoba 2015Angular 2 is Coming - GDG DevFest Cordoba 2015
Angular 2 is Coming - GDG DevFest Cordoba 2015
 
Angular js Frontenders Valencia
Angular js Frontenders ValenciaAngular js Frontenders Valencia
Angular js Frontenders Valencia
 
Introducción a AngularJS
Introducción a AngularJSIntroducción a AngularJS
Introducción a AngularJS
 
Curso de Responsive Design
Curso de Responsive DesignCurso de Responsive Design
Curso de Responsive Design
 
Angular.js
Angular.jsAngular.js
Angular.js
 
Angular Conceptos Practicos 1
Angular Conceptos Practicos 1Angular Conceptos Practicos 1
Angular Conceptos Practicos 1
 
De HTML a Express
De HTML a ExpressDe HTML a Express
De HTML a Express
 
Workshop 7: Single Page Applications
Workshop 7: Single Page ApplicationsWorkshop 7: Single Page Applications
Workshop 7: Single Page Applications
 
Introducción a AngularJS
Introducción a AngularJS Introducción a AngularJS
Introducción a AngularJS
 
Presentacion diseño web con jquery
Presentacion diseño web con jqueryPresentacion diseño web con jquery
Presentacion diseño web con jquery
 

Similar a Login social con node.js

"Los Imprescindibles de .NetCore"
"Los Imprescindibles de .NetCore""Los Imprescindibles de .NetCore"
"Los Imprescindibles de .NetCore"www.encamina.com
 
Appcircus Academy: Integración de Social Media en Android
Appcircus Academy: Integración de Social Media en AndroidAppcircus Academy: Integración de Social Media en Android
Appcircus Academy: Integración de Social Media en AndroidAlberto Ruibal
 
Codemotion 2017 - Taller de JHipster
Codemotion 2017 - Taller de JHipsterCodemotion 2017 - Taller de JHipster
Codemotion 2017 - Taller de JHipsterAdolfo Sanz De Diego
 
JSDays Desarrolla tu primera API
JSDays Desarrolla tu primera APIJSDays Desarrolla tu primera API
JSDays Desarrolla tu primera APICloudAppi
 
Taller desarrollo de apis
Taller desarrollo de apisTaller desarrollo de apis
Taller desarrollo de apisCloudAppi
 
Php Bitter Sweet Symfony!
Php Bitter Sweet Symfony!Php Bitter Sweet Symfony!
Php Bitter Sweet Symfony!Ricard Luquero
 
.NET UY Meetup 5 - MVC For Human Beings by Leonardo Botta
.NET UY Meetup 5 - MVC For Human Beings by Leonardo Botta.NET UY Meetup 5 - MVC For Human Beings by Leonardo Botta
.NET UY Meetup 5 - MVC For Human Beings by Leonardo Botta.NET UY Meetup
 
WordPress como back-end de nuestras apps
WordPress como back-end de nuestras appsWordPress como back-end de nuestras apps
WordPress como back-end de nuestras appsJaime Fernández
 
15a. Reunion de SpringHispano.org y grails.org.mx
15a. Reunion de SpringHispano.org y grails.org.mx15a. Reunion de SpringHispano.org y grails.org.mx
15a. Reunion de SpringHispano.org y grails.org.mxJose Juan R. Zuñiga
 
inLab FIB MeteorJS workshop by uLab UPC - Telefonica I+D
inLab FIB MeteorJS workshop by uLab UPC - Telefonica I+DinLab FIB MeteorJS workshop by uLab UPC - Telefonica I+D
inLab FIB MeteorJS workshop by uLab UPC - Telefonica I+DinLabFIB
 
Aplicaciones_Android_JPD.pptx
Aplicaciones_Android_JPD.pptxAplicaciones_Android_JPD.pptx
Aplicaciones_Android_JPD.pptxMarianaRomo28
 
Tallerprogramacion
TallerprogramacionTallerprogramacion
Tallerprogramacionjohanadoria
 

Similar a Login social con node.js (20)

APIREST LARAVEL Y PHP.pptx
APIREST LARAVEL Y PHP.pptxAPIREST LARAVEL Y PHP.pptx
APIREST LARAVEL Y PHP.pptx
 
"Los Imprescindibles de .NetCore"
"Los Imprescindibles de .NetCore""Los Imprescindibles de .NetCore"
"Los Imprescindibles de .NetCore"
 
Appcircus Academy: Integración de Social Media en Android
Appcircus Academy: Integración de Social Media en AndroidAppcircus Academy: Integración de Social Media en Android
Appcircus Academy: Integración de Social Media en Android
 
Presentacion YII
Presentacion YIIPresentacion YII
Presentacion YII
 
Codemotion 2017 - Taller de JHipster
Codemotion 2017 - Taller de JHipsterCodemotion 2017 - Taller de JHipster
Codemotion 2017 - Taller de JHipster
 
JSDays Desarrolla tu primera API
JSDays Desarrolla tu primera APIJSDays Desarrolla tu primera API
JSDays Desarrolla tu primera API
 
Taller desarrollo de apis
Taller desarrollo de apisTaller desarrollo de apis
Taller desarrollo de apis
 
Php Bitter Sweet Symfony!
Php Bitter Sweet Symfony!Php Bitter Sweet Symfony!
Php Bitter Sweet Symfony!
 
Aplicación abc. asp net mvc 3
Aplicación abc. asp net mvc 3Aplicación abc. asp net mvc 3
Aplicación abc. asp net mvc 3
 
.NET UY Meetup 5 - MVC For Human Beings by Leonardo Botta
.NET UY Meetup 5 - MVC For Human Beings by Leonardo Botta.NET UY Meetup 5 - MVC For Human Beings by Leonardo Botta
.NET UY Meetup 5 - MVC For Human Beings by Leonardo Botta
 
10.desarrollowebconjava
10.desarrollowebconjava10.desarrollowebconjava
10.desarrollowebconjava
 
WordPress como back-end de nuestras apps
WordPress como back-end de nuestras appsWordPress como back-end de nuestras apps
WordPress como back-end de nuestras apps
 
Ebook tutorialspringbootheroku
Ebook tutorialspringbootherokuEbook tutorialspringbootheroku
Ebook tutorialspringbootheroku
 
Servicios web
Servicios webServicios web
Servicios web
 
Cv dennys-jose-marquez-reyes-desarrollador-web
Cv dennys-jose-marquez-reyes-desarrollador-webCv dennys-jose-marquez-reyes-desarrollador-web
Cv dennys-jose-marquez-reyes-desarrollador-web
 
15a. Reunion de SpringHispano.org y grails.org.mx
15a. Reunion de SpringHispano.org y grails.org.mx15a. Reunion de SpringHispano.org y grails.org.mx
15a. Reunion de SpringHispano.org y grails.org.mx
 
Introducción a AngularJS
Introducción a AngularJSIntroducción a AngularJS
Introducción a AngularJS
 
inLab FIB MeteorJS workshop by uLab UPC - Telefonica I+D
inLab FIB MeteorJS workshop by uLab UPC - Telefonica I+DinLab FIB MeteorJS workshop by uLab UPC - Telefonica I+D
inLab FIB MeteorJS workshop by uLab UPC - Telefonica I+D
 
Aplicaciones_Android_JPD.pptx
Aplicaciones_Android_JPD.pptxAplicaciones_Android_JPD.pptx
Aplicaciones_Android_JPD.pptx
 
Tallerprogramacion
TallerprogramacionTallerprogramacion
Tallerprogramacion
 

Más de Carlos Azaustre

Introducción al JAMStack - JS Ourense
Introducción al JAMStack - JS OurenseIntroducción al JAMStack - JS Ourense
Introducción al JAMStack - JS OurenseCarlos Azaustre
 
Serverless with Firebase - Launchpad Build Burgos
Serverless with Firebase - Launchpad Build Burgos Serverless with Firebase - Launchpad Build Burgos
Serverless with Firebase - Launchpad Build Burgos Carlos Azaustre
 
Your First Assistant App with DialogFlow + Firebase
Your First Assistant App with DialogFlow + FirebaseYour First Assistant App with DialogFlow + Firebase
Your First Assistant App with DialogFlow + FirebaseCarlos Azaustre
 
PixelsCamp 2017 - Cloud Functions for Firebase and Machine Learning APIs
PixelsCamp 2017 - Cloud Functions for Firebase and Machine Learning APIsPixelsCamp 2017 - Cloud Functions for Firebase and Machine Learning APIs
PixelsCamp 2017 - Cloud Functions for Firebase and Machine Learning APIsCarlos Azaustre
 
Prototipado de Aplicaciones web con Firebase #CampusGivers
Prototipado de Aplicaciones web con Firebase #CampusGiversPrototipado de Aplicaciones web con Firebase #CampusGivers
Prototipado de Aplicaciones web con Firebase #CampusGiversCarlos Azaustre
 
Workshop React + Firebase | T3chFest 2017
Workshop React + Firebase | T3chFest 2017Workshop React + Firebase | T3chFest 2017
Workshop React + Firebase | T3chFest 2017Carlos Azaustre
 
Hack2Progress - Consejos para afrontar un Hackathon
Hack2Progress - Consejos para afrontar un HackathonHack2Progress - Consejos para afrontar un Hackathon
Hack2Progress - Consejos para afrontar un HackathonCarlos Azaustre
 
Taller de Seo y Facebook Ads
Taller de Seo y Facebook AdsTaller de Seo y Facebook Ads
Taller de Seo y Facebook AdsCarlos Azaustre
 
Game of Frameworks - GDG Cáceres #CodeCC
Game of Frameworks - GDG Cáceres #CodeCCGame of Frameworks - GDG Cáceres #CodeCC
Game of Frameworks - GDG Cáceres #CodeCCCarlos Azaustre
 
#PlatziConf - El camino para ser un Pro en JavaScript
#PlatziConf - El camino para ser un Pro en JavaScript#PlatziConf - El camino para ser un Pro en JavaScript
#PlatziConf - El camino para ser un Pro en JavaScriptCarlos Azaustre
 
Chefly: Pitch for Tetuan Valley Startup School
Chefly: Pitch for Tetuan Valley Startup SchoolChefly: Pitch for Tetuan Valley Startup School
Chefly: Pitch for Tetuan Valley Startup SchoolCarlos Azaustre
 
Nuestra experiencia emprendedora
Nuestra experiencia emprendedoraNuestra experiencia emprendedora
Nuestra experiencia emprendedoraCarlos Azaustre
 

Más de Carlos Azaustre (13)

Introducción al JAMStack - JS Ourense
Introducción al JAMStack - JS OurenseIntroducción al JAMStack - JS Ourense
Introducción al JAMStack - JS Ourense
 
Serverless with Firebase - Launchpad Build Burgos
Serverless with Firebase - Launchpad Build Burgos Serverless with Firebase - Launchpad Build Burgos
Serverless with Firebase - Launchpad Build Burgos
 
Your First Assistant App with DialogFlow + Firebase
Your First Assistant App with DialogFlow + FirebaseYour First Assistant App with DialogFlow + Firebase
Your First Assistant App with DialogFlow + Firebase
 
PixelsCamp 2017 - Cloud Functions for Firebase and Machine Learning APIs
PixelsCamp 2017 - Cloud Functions for Firebase and Machine Learning APIsPixelsCamp 2017 - Cloud Functions for Firebase and Machine Learning APIs
PixelsCamp 2017 - Cloud Functions for Firebase and Machine Learning APIs
 
Prototipado de Aplicaciones web con Firebase #CampusGivers
Prototipado de Aplicaciones web con Firebase #CampusGiversPrototipado de Aplicaciones web con Firebase #CampusGivers
Prototipado de Aplicaciones web con Firebase #CampusGivers
 
Workshop React + Firebase | T3chFest 2017
Workshop React + Firebase | T3chFest 2017Workshop React + Firebase | T3chFest 2017
Workshop React + Firebase | T3chFest 2017
 
Hack2Progress - Consejos para afrontar un Hackathon
Hack2Progress - Consejos para afrontar un HackathonHack2Progress - Consejos para afrontar un Hackathon
Hack2Progress - Consejos para afrontar un Hackathon
 
Taller de Seo y Facebook Ads
Taller de Seo y Facebook AdsTaller de Seo y Facebook Ads
Taller de Seo y Facebook Ads
 
Game of Frameworks - GDG Cáceres #CodeCC
Game of Frameworks - GDG Cáceres #CodeCCGame of Frameworks - GDG Cáceres #CodeCC
Game of Frameworks - GDG Cáceres #CodeCC
 
Chefly Keynote at ETSII
Chefly Keynote at ETSIIChefly Keynote at ETSII
Chefly Keynote at ETSII
 
#PlatziConf - El camino para ser un Pro en JavaScript
#PlatziConf - El camino para ser un Pro en JavaScript#PlatziConf - El camino para ser un Pro en JavaScript
#PlatziConf - El camino para ser un Pro en JavaScript
 
Chefly: Pitch for Tetuan Valley Startup School
Chefly: Pitch for Tetuan Valley Startup SchoolChefly: Pitch for Tetuan Valley Startup School
Chefly: Pitch for Tetuan Valley Startup School
 
Nuestra experiencia emprendedora
Nuestra experiencia emprendedoraNuestra experiencia emprendedora
Nuestra experiencia emprendedora
 

Último

CLASE DE TECNOLOGIA E INFORMATICA PRIMARIA
CLASE  DE TECNOLOGIA E INFORMATICA PRIMARIACLASE  DE TECNOLOGIA E INFORMATICA PRIMARIA
CLASE DE TECNOLOGIA E INFORMATICA PRIMARIAWilbisVega
 
Proyecto integrador. Las TIC en la sociedad S4.pptx
Proyecto integrador. Las TIC en la sociedad S4.pptxProyecto integrador. Las TIC en la sociedad S4.pptx
Proyecto integrador. Las TIC en la sociedad S4.pptx241521559
 
Redes direccionamiento y subredes ipv4 2024 .pdf
Redes direccionamiento y subredes ipv4 2024 .pdfRedes direccionamiento y subredes ipv4 2024 .pdf
Redes direccionamiento y subredes ipv4 2024 .pdfsoporteupcology
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITMaricarmen Sánchez Ruiz
 
9egb-lengua y Literatura.pdf_texto del estudiante
9egb-lengua y Literatura.pdf_texto del estudiante9egb-lengua y Literatura.pdf_texto del estudiante
9egb-lengua y Literatura.pdf_texto del estudianteAndreaHuertas24
 
guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan JosephBRAYANJOSEPHPEREZGOM
 
Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíassuserf18419
 
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...silviayucra2
 
Presentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxPresentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxLolaBunny11
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricKeyla Dolores Méndez
 
International Women's Day Sucre 2024 (IWD)
International Women's Day Sucre 2024 (IWD)International Women's Day Sucre 2024 (IWD)
International Women's Day Sucre 2024 (IWD)GDGSucre
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveFagnerLisboa3
 
Desarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfDesarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfJulian Lamprea
 

Último (13)

CLASE DE TECNOLOGIA E INFORMATICA PRIMARIA
CLASE  DE TECNOLOGIA E INFORMATICA PRIMARIACLASE  DE TECNOLOGIA E INFORMATICA PRIMARIA
CLASE DE TECNOLOGIA E INFORMATICA PRIMARIA
 
Proyecto integrador. Las TIC en la sociedad S4.pptx
Proyecto integrador. Las TIC en la sociedad S4.pptxProyecto integrador. Las TIC en la sociedad S4.pptx
Proyecto integrador. Las TIC en la sociedad S4.pptx
 
Redes direccionamiento y subredes ipv4 2024 .pdf
Redes direccionamiento y subredes ipv4 2024 .pdfRedes direccionamiento y subredes ipv4 2024 .pdf
Redes direccionamiento y subredes ipv4 2024 .pdf
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
9egb-lengua y Literatura.pdf_texto del estudiante
9egb-lengua y Literatura.pdf_texto del estudiante9egb-lengua y Literatura.pdf_texto del estudiante
9egb-lengua y Literatura.pdf_texto del estudiante
 
guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Joseph
 
Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnología
 
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
 
Presentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxPresentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptx
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
 
International Women's Day Sucre 2024 (IWD)
International Women's Day Sucre 2024 (IWD)International Women's Day Sucre 2024 (IWD)
International Women's Day Sucre 2024 (IWD)
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
 
Desarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfDesarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdf
 

Login social con node.js

  • 1. Login Social con Node.js Comunidad Mejorando.la Login social con Node.js Gestión de usuarios con PassportJS
  • 2. Login Social con Node.js Comunidad Mejorando.la ¿Qué es PassportJS? Middleware de autenticación para Node.js, que facilita la autenticación y registro de usuarios de una aplicación web. http://passportjs.org
  • 3. Login Social con Node.js Comunidad Mejorando.la ¿Qué necesitamos? ● Instalar Node.js http://nodejs.org/download/ ● Instalar MongoDB https://www.mongodb.org/downloads
  • 4. Login Social con Node.js Comunidad Mejorando.la ¡Comenzamos! Creamos una estructura base de aplicación con el framework Express Instalamos las dependencias que vamos a utilizar $ sudo npm install -g express $ express passport-example $ cd passport-example $ npm install $ npm install --save mongoose $ npm install --save passport $ npm install --save passport-twitter $ npm install --save passport-facebook
  • 5. Login Social con Node.js Comunidad Mejorando.la Modelo usuario models/user.js var mongoose = require('mongoose'); var Schema = mongoose.Schema; var UserSchema = new Schema({ name: String, provider: String, provider_id: {type: String, unique: true}, photo: String, createdAt: {type: Date, default: Date.now} }); var User = mongoose.model('User', UserSchema);
  • 6. Login Social con Node.js Comunidad Mejorando.la Configuración de Passport passport.js var mongoose = require('mongoose'); var User = mongoose.model('User'); var TwitterStrategy = require('passport-twitter').Strategy; var FacebookStrategy = require('passport-facebook').Strategy; module.exports = function(passport) { passport.serializeUser(function(user, done) { done(null, user); }); passport.deserializeUser(function(obj, done) { done(null, obj); }); . . .
  • 7. Login Social con Node.js Comunidad Mejorando.la Configuración de Passport (Twitter) passport.js . . . passport.use(new TwitterStrategy({ consumerKey: 'TWITTER_CONSUMER_KEY', consumerSecret: 'TWITTER_CONSUMER_SECRET', callbackURL: '/auth/twitter/callback' }, function(accessToken, refreshToken, profile, done) { User.findOne({provider_id: profile.id}, function(err, user) { if(err) throw(err); if(!err && user!= null) return done(null, user); var user = new User({ provider_id: profile.id, provider: profile.provider, name: profile.displayName, photo: profile.photos[0].value }); user.save(function(err) { if(err) throw err; done(null, user); }); }); }));
  • 8. Login Social con Node.js Comunidad Mejorando.la Configuración de Passport (Facebook) passport.js . . . passport.use(new FacebookStrategy({ clientID: 'FACEBOOK_APP_CLIENT_ID', clientSecret: 'FACEBOOK_APP_SECRET_ID', callbackURL: '/auth/twitter/callback' }, function(accessToken, refreshToken, profile, done) { User.findOne({provider_id: profile.id}, function(err, user) { if(err) throw(err); if(!err && user!= null) return done(null, user); var user = new User({ provider_id: profile.id, provider: profile.provider, name: profile.displayName, photo: profile.photos[0].value }); user.save(function(err) { if(err) throw err; done(null, user); }); }); }));
  • 9. Login Social con Node.js Comunidad Mejorando.la Mantener las API KEYs apartadas del código fuente config.js passport.js . . . var config = { twitter: { key: ‘TWITTER_API_KEY’, secret: ‘TWITTER_API_SECRET’ }, facebook: { id: ‘FACEBOOK_APP_ID’, secret: ‘FACEBOOK_APP_SECRET’ } }; module.exports = config; var config = require(‘./config’); . . . passport.use(new TwitterStrategy({ consumerKey: 'config.twitter.key', consumerSecret: 'config.twitter.secret', callbackURL: '/auth/twitter/callback' . . . passport.use(new FacebookStrategy({ clientID: 'config.facebook.id', clientSecret: 'config.facebook.secret', callbackURL: '/auth/twitter/callback' . . .
  • 10. Login Social con Node.js Comunidad Mejorando.la Conjuntando todo app.js ... var mongoose = require('mongoose'); var passport = require('passport'); require('./models/user'); require('./passport')(passport); mongoose.connect('mongodb://localhost/passport-example', function(err, res) { if(err) throw err; console.log('Conectado con éxito a la BD'); }); … app.use(express.cookieParser()); app.use(express.urlencoded()); app.use(express.json()); app.use(express.methodOverride()); app.use(express.session({ secret: 'secretkey' })); // Configuración de Passport app.use(passport.initialize()); app.use(passport.session()); ... // Rutas de Passport app.get('/logout', function(req, res) { req.logout(); res.redirect('/'); }); app.get('/auth/twitter', passport.authenticate ('twitter')); app.get('/auth/facebook', passport.authenticate ('facebook')); app.get('/auth/twitter/callback', passport. authenticate('twitter', { successRedirect: '/', failureRedirect: '/login' })); app.get('/auth/facebook/callback', passport. authenticate('facebook', { successRedirect: '/', failureRedirect: '/login' })); ...
  • 11. Login Social con Node.js Comunidad Mejorando.la Registro de App en FB/TW Acceder a la sección “Desarrolladores” de Facebook y Twitter para registrar una App y adquirir un API Key y un API Secret http://dev.twitter.com http://developers.facebook.com
  • 12. Login Social con Node.js Comunidad Mejorando.la Obtención de API Keys (Twitter)
  • 13. Login Social con Node.js Comunidad Mejorando.la Obtención de API Keys (Facebook)
  • 14. Login Social con Node.js Comunidad Mejorando.la Controlador de la vista principal routes/index.js Le indicamos que variables queremos que se visualicen en el HTML views/index.jade exports.index = function(req, res){ res.render('index', { title: 'Passport-Example', user: req.user }); }; if(user) ul li img(src="#{user.photo}") li Bienvenido #{user.name} li a(href='logout') Salir else ul li a(href='auth/twitter') Login con Twitter li a(href='auth/facebook') Login con Facebook
  • 15. Login Social con Node.js Comunidad Mejorando.la ¡Y voilá! Código disponible en: http://github.com/carlosazaustre/passportjs-example $ mongod & $ node app.js
  • 16. Login Social con Node.js Comunidad Mejorando.la ¡Gracias! Carlos Azaustre Desarrollador Web / JavaScript Lover / MOOC Addict / Based in Madrid,Spain carlosazaustre.es/blog @carlosazaustre /carlosazaustre.web /carlosazaustre /+CarlosAzaustre
  • 17. Login Social con Node.js Comunidad Mejorando.la Preguntas