Tutorial de Sails.
js: Creación del Modelo Usuario y Autenticación
BACKEND (/BLOG/CATEGORIA/BACKEND/)
Javier Delgado Magdalena
Blog (/blog/?ref=post) 3
24 JUNIO 2015
Lo primero que vamos a hacer es crear el modelo y el controlador , para ello ejecutaremos la siguiente
sentencia en la consola:
~/videoclub $ sails generate api user
Mediante el atributo api generamos el modelo y el controlador; Si quisiéramos crear únicamente el modelo
utilizaríamos el atributo model ; Y si quisiéramos crear únicamente el controlador utilizaríamos el atributo
controller .
Ahora, en el modelo escribiremos los siguiente:
/**
* User.js
*
* @description :: TODO: You might write a short summary of how this model works and what i
t represents here.
* @docs :: http://sailsjs.org/#!documentation/models
*/
module.exports = {
attributes: {
name: {
type: 'string',
required: true
},
lastname: {
type: 'string',
required: true
},
email: {
type: 'string',
required: true,
unique: true
},
encryptedPassword: {
type: 'string'
},
// Este método es para evitar pasar toda la información del modelo
// Evitamos pasar los siguientes parámetros: password, confirmation, encryptedpassword
y _csrf.
toJSON: function() {
var obj = this.toObject();
delete obj.password;
delete obj.confirmation;
delete obj.encryptedPassword;
delete obj._csrf;
return obj;
}
}
};
Los atributos que permite sails (http://sailsjs.org/#!/documentation/concepts/ORM/Attributes.html) son
los siguientes: string , text , integer , �oat , date , datetime , boolean , binary , array , json , email .
Además, podemos especi�car si el atributo es obligatorio, único, su valor por defecto, etc. Todo esto nos
permite crear un modelo de manera muy simple y nos abstrae a la hora de crearlo en la base de datos
gracias a waterline .
Dentro del modelo podemos crear los métodos que deseemos y unos callbacks que se ejecutarán antes de
ciertas acciones.
Callbacks on create
beforeValidate: fn(values, cb)
afterValidate: fn(values, cb)
beforeCreate: fn(values, cb)
afterCreate: fn(newlyInsertedRecord, cb)
Callbacks on update
beforeValidate: fn(valuesToUpdate, cb)
afterValidate: fn(valuesToUpdate, cb)
beforeUpdate: fn(valuesToUpdate, cb)
afterUpdate: fn(updatedRecord, cb)
Callbacks on destroy
beforeDestroy: fn(criteria, cb)
afterDestroy: fn(destroyedRecords, cb)
Más adelante veremos como utilizarlos.
Después iremos a views y crearemos la carpeta user y dentro de dicha carpeta los �cheros index.ejs :
<div class="container">
<h3>Usuarios
<table class='table'>
<tr>
<th>ID
<th>Nombre
<th>Apellidos
<th>Email
<th>
<th>
<th>
</tr>
<% _.each(users, function(user) { %>
<tr data-id="<%= user.id %>" data-model="user">
<td><%= user.id %>
<td><%= user.name %>
<td><%= user.lastname %>
<td><%= user.email %>
<td><a href="/user/show/<%= user.id %>" class="btn btn-sm btn-primary">Show</a>
<td><a href="/user/edit/<%= user.id %>" class="btn btn-sm btn-warning">Edit</a>
<td><form action="/user/destroy/<%= user.id %>" method="POST">
<input type="hidden" name="_method" value="delete"/>
<input type="submit" class="btn btn-sm btn-danger" value="Delete"/>
<input type="hidden" name="_csrf" value="<%= _csrf %>" />
</form>
</td>
</tr>
<% }) %>
</table>
<a href="/user/new">Crear Nuevo Usuario</a>
</div>
Como podemos ver lo que hacemos es crear una tabla donde mostraremos la información de cada usuario
creado.
Respecto al código podemos ver la siguiente línea: <% _.each(user, function(user) { %>
Lo que hace es recorrer cada uno de los usuarios (users) y llama a la funcion function(user) donde le pasa el
user.id buscando dentro del modelo mediante data-id pasandole el nombre del modelo: data-
model="user" .
<% _.each(users, function(user) { %>
<tr data-id="<%= user.id %>" data-model="user">
<td><%= user.id %>
<td><%= user.name %>
<td><%= user.lastname %>
<td><%= user.email %>
<td><a href="/user/show/<%= user.id %>" class="btn btn-sm btn-primary">Show</a>
<td><a href="/user/edit/<%= user.id %>" class="btn btn-sm btn-warning">Edit</a>
<td><form action="/user/destroy/<%= user.id %>" method="POST">
<input type="hidden" name="_method" value="delete"/>
<input type="submit" class="btn btn-sm btn-danger" value="Delete"/>
<input type="hidden" name="_csrf" value="<%= _csrf %>" />
</form>
</td>
</tr>
<% }) %>
Y ahora el �chero new.ejs :
<form action="/user/create" method="POST" class="form-signin">
<h2 class="form-signin-heading"> Crear Usuario
<div class="control-group">
<input type="text" class="form-control" placeholder="Nombre" name="name">
</div>
<div class="control-group">
<input type="text" class="form-control" placeholder="Apellidos" name="lastname">
</div>
<div class="control-group">
<input type="text" class="form-control" placeholder="Email" name="email">
</div>
<div class="control-group">
<input type="password" class="form-control" placeholder="Contraseña" name="passw
ord">
</div>
<div class="control-group">
<input type="password" class="form-control" placeholder="Repita Contraseña" name
="confirmation">
</div>
<br/>
<input type="submit" class="btn btn-lg btn-primary btn-block" value="Create User
"/>
<input type="hidden" name="_csrf" value="<%=_csrf %>"/>
</form>
Ahora vamos al controlador y cremos los métodos para dichas vistas. Los nombres serán los que están en el
action .
/**
* UserController
*
* @description :: Server-side logic for managing users
* @help :: See http://links.sailsjs.org/docs/controllers
*/
module.exports = {
'new': function (req, res) {
res.view();
},
index: function (req, res) {
User.find(function foundUser (err, users) {
if(err) return res.redirect('/user/new');
res.view({
users: users
});
});
},
create: function(req, res) {
User.create(req.params.all(), function userCreated(err, user) {
if (err) return res.redirect('/user/new');
res.redirect('/user/show/' + user.id);
});
}
};
Finalmente, accedemos al archivo routes.js y añadimos una nueva ruta para que cuando accedamos a
cualquier vista de user no redireccione a 403, sino que permita renderizar las vistas. Para ello añadiremos
el siguiente código debajo de la ruta raíz con una coma (,).
module.exports.policies = {
// '*': true,
'user': {
'new': true,
index: 'sessionAuth',
'*': true
}
};
Que signi�ca esto, pues vamos a explicar:
La parte comentada, // '*': true, signi�ca que cualquier vista que se muestre tendrá todos los accesos y
permisos abiertos.
Ahora hemos insertado 'user' que es el nombre del modelo y dentro damos los permisos para cada método
del controlador. Como podemos ver para poder acceder a 'index' deberemos estar autenticados, si no lo
estamos nos redireccionará la vista 'new' (dentro del metodo create: if (err) return res.redirect('/user
/new'); ). sessionAuth hace referencia al �chero sessionAuth.js que está en api/policies.
Y para el resto de operaciones ( '*' ) tenemos todos los accesos, es decir no tenemos ninguna reestricción,
como la necesidad de estar autenticados.
3 Comentarios - Únete a la conversación
INICIA SESIÓN PARA COMENTAR (/ACCOUNTS/LOGIN/?NEXT=/BLOG/TUTORIAL-DE-SAILSJS-CREACION-DEL-MODELO-USUARIO-Y-AU
Miguel Leon
HACE 2 AÑOS
Hola Javier.
Gracias por tu colaboración.
Soy principiante. Hice todo lo indicado y con http://localhost:1337/user pero sale un error, prohibiendo el ingreso:
"You don't have permission to see the page you're trying to reach.".
La explicación del tuto, para mi gusto y principiante muy ligera.
No hay los fuentes para cotejar,
(Debería haber un ejemplo con Pg o Mysql)
De todos modos hay que agradecer tu esfuerzo
RE SPONDE R ( /ACCOUNTS/LOGIN/ ?NEX T=/FORUM/DISCU SSION/9 7 7 / # M E S SAG E - 1 3 2 3)
Luis Sanchez
HACE 2 AÑOS
revisa el api/controllers/userController.js
dale http://localhost:1337/user/new
RE SPONDE R ( /ACCOUNTS/LOGIN/ ?NEX T=/FORU M / D I SC U SS I O N/ 9 7 7 / # M E S SAG E - 1 3 2 8)
Ilmar López
HACE 2 AÑOS, 2 MESES
Buen aporte amigo, soy novato utilizando estas tecnologías y javaScript, me gustaría saber donde mas puedo encontrar tutoriales como este,
mucha gracias.
RE SPONDE R ( /ACCOUNTS/LOGIN/ ?NEX T=/FORUM/DISCU SSION/9 7 7 / # M E S SAG E - 1 1 2 8)
Prueba 7 días gratis COMENZAR 7 DÍAS GRATIS (/PRECIOS/)
AC C ESO C O M PLETO Y SIN C O M PRO M ISO S
(https://mixpanel.com/f/partner) (https://www.enisa.es)
Avenida República Argentina, 26. 41011 Sevilla. +34 954 002 382 © 2017. ( H T T
P S(://
H TWTP
W(SH
W.FAC
://
T T
W
P S(IH
://
ETB
TTW
T
O
EP
R
O
W(S.C
H
K://
W.I
T
O.CT
T.M
MOP
N/O
M
SSE
://
TAG
/O
P
/OEPSN
PR
E.L
EW
N
AN
IN
W
M
E