Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
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