Formulario de login con Node.js

Clase 44 de 50 • Curso de Programación Básica 2014

Faacuu Diaz

student•

Si alguien tuvo problemas con res.sendfile... les dejo la solución.

web.get("/", function(req, res){

res.sendFile("formulario.html", {root:__dirname});
});
Simplemente es por la versión mas actualizada de express donde reemplazo sendfile por sendFile y ademas pide que se especifique la carpeta raiz.

Erick Orlando Velasco Martínez

student•

Perfecto, así funciono de maravilla con la nueva version de sendFile.
Gracias!

John Alanis

student•

Puse lo que dijiste pero ahora me sale esto, AYUDA!!! =(

Error: ENOENT: no such file or directory, stat '/Users/JoNaS/Desktop/programacionBasica/NODE/formulario.html'
at Error (native)

Fernando López Moreno

student•

Debo aceptar que ahora me resulta más fascinante el área del Backend.

Offtopic:

Cesar David Ramírez Dimaté

student•

Instalar body-paser de manera local (desde la raíz)

npm install body-parser

formulario.html

<!DOCTYPE html>  
<html>  
    <head>  
        <meta charset="utf-8" />  
        <title>Entra si eres capaz</title>  
    </head>  
    <body>  
        <h2>Coloca tu usuario y tu contraseña</h2>  
        <form method="post" action="/entrar">  
            Usuario:  
            <input type="text" id="user" name="usuario" />  
            <br />  
            Contraseña:  
            <input type="password" id="pass" name="clave" />  
            <br />  
            <input type="submit" id="enviar" name="enviar" value="Entrar" />  
        </form>  
    </body>  
</html>

backend.js

var pepito = "Bogotá";  
var basededatos = { // Objeto JSON  
    usuario: "freddier",  
    password: "mejorandola"  
};  
  
console.log("Arrancando server de Node JS");  
  
var express = require("express"); // Instrucción de Javascript que corre al lado del servidor.  
var parcero = require("body-parser"); // Parsea los datos del formulario a un objeto de Javascript.  
var web = express(); // Crear aplicación Web.  
web.use( parcero. urlencoded() );  
var server; // Sevidor corriendo  
  
server = web.listen(8080, function() { // Parámetros (Puerto, Función Anónima)  
    console.log("Sevidor arrancado :D");  
});  
  
web.get("/", function (req, res) {  
    res.sendfile("formulario.html");  
});  
  
web.post("/entrar", function (req, res) {  
    console.log(req.body);  
    // Siempre debe darse una respuesta al navegador (response).  
    //res.send("Enviado");  
    if(req.body.usuario == basededatos.usuario && req.body.clave == basededatos.password)  
        res.send("Bienvenido al área secreta de NodeJs");  
    else  
        res.send("Shu, shu, fuera de aquí");  
});  
  
/* Prueba de URL Amigables */  
web.get("/prueba", function (req, res) { // Petición GET con el / como el home de la página web. Función Anónima (request, response)  
    res.send("Buen trabajo, lograste un servidor web desde " + pepito); // Enviar texto plano al navegador.  
});  
  
// Prueba de HTML  
web.get("/hola/mama-es-linda", function (req, res) {  
    res.send("Hola <strong>mamá</strong>, estoy triunfando");  
});  
  
// Prueba de variables GET y variables globales  
web.get("/test", function (req, res) { // http://127.0.0.1:8080/test?avion=airbus&edad=28  
    console.log(req);  
    res.send("tu avión es el " + req.query.avion + " y tu edad es " + req.query.edad);  
});

Luis Saraza

student•

Si desean reiniciar el servidor cada que realicen un cambio (para evitar el trabajo molesto reiniciarlo manualmente todo el tiempo), se puede hacer uso de nodemon:

npm install nodemon -g

John Rios

student•

por si aun se están perdiendo compañeros, aquí les dejo la documentación de la librería Express de Node.js:

Juan Jose Fernandez Belloso

student•

Arrancando server de Node
module.js:338
throw err;
^
Error: Cannot find module 'body-parse'
at Function.Module._resolveFilename (module.js:336:15)
at Function.Module._load (module.js:278:25)
at Module.require (module.js:365:17)
at require (module.js:384:17)
at Object.<anonymous> (~~pruebas platzi.com\node\bac
kend.js:10:15)
at Module._compile (module.js:460:26)
at Object.Module._extensions..js (module.js:478:10)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
at Function.Module.runMain (module.js:501:10)

Al arrancar el body-parser me da este error. He vuelto a instalar y me sigue dando error

Jose Luis Macias Santana

student•

en la linea:

var parcero = require("body-parser");

esta poniendo
body-parse en ves de poner body-parser
hacer falta la "r"

Camilo Tabares

student•

cuando trate de obtener formulario.html como en el video me sale un error aparentemente del package JSON, pero lo pude solucionar asi(lo solucione pero me gustaria saber porque me salio ese error, creo que es con algo relacionado a que deben ser urls absolutas):

web.get("/", function(req , res){  
    //res.sendFile("formulario.html");  
    res.sendFile(__dirname + '/formulario.html');  
})

David Rangel

student•

Creo que el error estaba en el senfile

en la primera linea esta en mayúscula y en segunda esta con minúscula, lo correcto es minúscula.

yo necesito ayuda en la comparación, no entra cuando escribo esto:

if(req.body.usuario == baseDeDatos.usuario &&

req.body.clave == baseDeDatos.password)

Beto Mendez Vilca

student•

Diferencias entre GET Y POST

Method Get: Envía datos y son visibles en la url
Method Post: Envía los datos y estos están ocultos

Julio Cesar Labrador Rosales

student•

req.query = es por donde llega las variables get.
req.body= es por donde llega las variables post.

Excelente video freddy.

Hernando Hurtado Hoyos

student•

Hola estoy creando un formulario para enviar un mensaje a mi correo pero sale este error "Cannot read property 'response' of undefined" y no se por que me ayudan.

app.post('/enviar',function (req,res){  
  
    var email = req.body.email;  
  
    if(/(.+)@(.+){2,}\.(.+){2,}/.test(email)){  
  
        var transport = nodemailer.createTransport('SMTP',{  
        host:"/",  
        secureConnection: false,  
        port:2626,  
        auth: {  
            user: "micorreo@gmail.com",  
            pass: "micontraseña"  
            }  
        });  
  
        var options = {  
        from: req.body.nombre + '&lt' + req.body.email + '&gt', name= "nombre" y name="email" en html  
        to:'micorreo@gmail.com',  
        subject:req.body.asunto, // name="asunto en" html  
        text: req.body.texto //name="texto" en html  
        }  
  
        transport.sendMail(options,function (error,info){  
        if(error){  
            res.send("no se ha logrado");  
               }  
            console.log(info.response);  
            res.send("lo logre!!!");  
        });  
  
    }  
  
    else  
    {  
        res.send("El email no se valido Volver")  
    }  
  
});

Juan Carlos Espinoza Zurita

student•

Para poder enviar un email usando tu cuenta de gmail en "host" debes poner smtp.gmail.com que es el servidor SMTP de Gmail y en port tienes que poner 25 o 465. El campo host se debe llamar con un nombre de dominio o un dirección IP del servidor al que te quieres conectar y el port depende del servidor. Me imagino que estabas intentado conectarte a tu propia computadora pero no creo que tengas un servidor SMTP corriendo en tu computadora.

Eduardo Lemus Zavala

student•

var baseDeDatos = {  
    usuario:"lalo",  
    password:"lemus"  
};  
  
//  
var parser = require("body-parser");  
//usamos el sistema de decodificacion de bodu-parser  
web.use(parser.urlencoded());  
web.post("/entrar", function(req,res){  
    //console.log(req.body);  
    //res.send("entraste");  
    if(req.body.usuario == baseDeDatos.usuario && req.body.clave == baseDeDatos.password)  
    {  
        res.send("Bienvenido");  
    }  
    else  
    {  
        res.send("Equivocado");  
    }  
});

Knock Boy

student•

Intente lo de la imagen y fue re genial

Roberto Araoz

student•

si quisiera mostrar una ventana modal en el cliente cuando el password es incorrecto en vez de tener que dar back en el navegador ( chrome ), que tendria que hacer ?

Oscar Pérez

student•

Hacer una petición por AJAX para validar las credenciales del usuario, luego si las credenciales son correctas, ya sabes... (los conceptos puedes investigarlos)

Héctor Rebollo Espinosa

student•

tengo un error de listener y me dice que mi puerto 80 ya esta ocupado, como puedo resolver ese error a parte de cambiarle el puerto en programa?

Manu Lagos

student•

Alguien sabe usar browserify?

Lorena Mendez

student•

Juan Castro

teacher•

Hola tengo una pregunta: si quisiera que la mini base de datos admitiera mas de un usuario y password como haría!
Ya lo intente con comas = y cualquier otra cosa!

Eduardo Lemus Zavala

student•

por que no intentas con un arreglo de usuarios y passwords

Raul Montano

student•

Hola Juandc, sabes yo también me hice la misma pregunta y lo solucione de esta manera.

console.log("Starting Node Server ...");  
  
  
// ******************************************************************  
  
// Creamos una Clase llamada Dbase  
var Dbase = function (u,p){  
        this.usuario  = u;  
        this.password = p;  
};  
  
  
// Creamos dos instancias de la clase Dbase.  
var usuario1 = new Dbase("raul","java");  
var usuario2 =  new Dbase("carlos","cafe");  
  
// Creamos un arrays que me va almacenar los objetos creados de la clase Dbase.   
var listaUsuarios=[];  
listaUsuarios[0]=usuario1;  
listaUsuarios[1]=usuario2;  
  
// ******************************************************************  
  
var express = require('express');  
var parcero = require('body-parser');  
  
var web = express();  
web.use(parcero.urlencoded());  
var server = web.listen(8080,function(){ console.log("Servidor Arrancado :D")});  
  
  
web.get("/",function(req,res){  
    res.sendFile("formulario.html",{root:__dirname});  
})  
  
  
web.post("/entrar", function (req, res)  
{  
   // Esta es una variable de control que me sirve para mostrar   
   // el mensaje correcto. Si es un usuario valido le doy la   
   // bienvenida sino le muestro un mensaje de error.  
     
   var bandera=0;   
  
   // Recorro mi array de objetos para determinar si los datos recibi   // dos por el formulario pertenecen a un usuario registrado.  
     
   for (var i=0; i<listaUsuarios.length;i++)   
   {  
        if(req.body.usuario == listaUsuarios[i].usuario &&   
           req.body.clave == listaUsuarios[i].password)  
        {      
           res.send("<h2>Bienvenido al área secreta de NodeJs</h2>");  
           i=listaUsuarios.length;  
           bandera=1;  
        }  
    }  
  
    if (bandera==0)   
             res.send("<h2>Shu, shu, fuera de aquí </h2>");  
          
});

Eduardo Lemus Zavala

student•

debemos instalar la libreria body-parser en la ruta del archivo backend.js para para interpretar el envio de datos desde metodos post

Julio Cesar Labrador Rosales

student•

var basededatos ={  
usuario:"julio",  
password:"mejor"  
};  
console.log("arrancando el server node");  
  
//express y la libreria body parser para poder entender formularios  
var express = require("express");  
var parcer = require("body-parser");  
var web = express();  
web.use(parcer.urlencoded({extended: true}) );  
var servidor;  
  
servidor = web.listen(8080,function () {  
    console.log("servidor arrancado");  
});  
  
web.get("/",function (req, res) {  
    console.log(req);  
    res.sendfile("formularionode.html");  
});  
web.post("/entrar",function (req, res) {  
    if(req.body.usuario == basededatos.usuario && req.body.clave == basededatos.password)  
    {  
        res.send("¡bienvenido al sistema!");  
    }  
    else  
    {  
        res.send("clave incorrecta...vuelva a intentarlo")  
    }  
});  
  
/*pruebas de urls y pasar varibles por get*/  
  
web.get("/test",function (req, res) {  
    console.log(req);  
    res.send("tu avion es el " + req.query.avion + " y tu edad es " + req.query.edad);  
});  
//prueba de html  
web.get("/hola/doris-es-linda",function (req, res) {  
    res.send("hola <strong>mami</strong>,como esta");  
});

Marco Estrada Lopez

student•

Muy Buena Explicacion

Formulario de login con Node.js

Bienvenido

Aprender a programar es fácil

La Web con Visión Profesional

Aprende sobre Algoritmos

Condicionales y operadores en programación

Qué lenguaje de programación aprender primero

Material del curso / Archivos del curso

Introducción básica a HTML y Javascript para programar

Uso del sistema de vídeo y notas

Lenguajes y compiladores

HTML y Javascript

Variables y funciones

Piedra, papel y tijera con Javascript

Variables, Matrices y Objetos en Javascript

Escribir HTML desde JS (document.write)

Matrices

Juego campo minado

Objetos del navegador

Objetos en JS

Preguntas

Ciclos y Dibujos con Canvas

Ciclos

Dibujos con canvas

Dibujar con eventos

Preguntas y respuestas

Programando juegos con canvas

Tipos de imágenes

Insertar imágenes en canvas

Dibujo de múltiples imágenes en canvas

Dibujar al enemigo y controlar a Diana

Sesión de preguntas y respuestas

Uso de Objetos, Prototype y juego de ahorcado en Canvas

Objetos en JavaScript con Prototype

Creando el juego del Ahorcado

Dibujo de un ahorcado usando Canvas

Sesión de preguntas y respuestas

Cómo crear un algoritmo para el juego del ahorcado

Extendiendo la funcionalidad de los Strings

Creando nuestro algoritmo para el juego del ahorcado

Sesión de preguntas y respuestas

Pregúntale a Freddy lo que quieras ... acerca de programación ;)

Todo lo que siempre quisiste saber sobre este curso y no te atrevías a preguntar - Parte 1

Todo lo que siempre quisiste saber sobre este curso y no te atrevías a preguntar - Parte 2

Conceptos básicos de programación: Frontend-Backend

¿Qué es Frontend y Backend?

Ejemplo de un login usando POST y GET

Ejemplo de un login usando AJAX

Sesión de preguntas y respuestas

Crea tu primer servidor web con Node.JS

Instalación de Node.js

Instalación de librerías de Node con npm

Modelo cliente servidor y seguridad web básica

Servidor web con Express y Node.js