Node.js学习（四）——实现用户登录功能

来源：互联网发布：毕向东35天java教学编辑：程序博客网时间：2024/05/29 14:46

Node.js学习（四）——实现用户登录功能

本文目的

了解node.js的整套前后台流程

具体实现

使用express创建项目

express -e nodejs-login-demo

修改package.json文件

添加mysql，bootstrap和jquery模块,用的是最新版本，所以写的是latest

{  "name": "nodejs-login-demo",  "version": "0.0.0",  "private": true,  "scripts": {    "start": "node ./bin/www"  },  "dependencies": {    "body-parser": "~1.15.1",    "cookie-parser": "~1.4.3",    "debug": "~2.2.0",    "ejs": "~2.4.1",    "express": "~4.13.4",    "morgan": "~1.7.0",    "serve-favicon": "~2.3.0",    "mysql":"latest",    "bootstrap":"latest",    "jquery":"latest"  }}

将jquery和bootstrap拷贝的public下对应位置

参考http://blog.csdn.net/flygoa/article/details/52677652

登录页面

修改index.ejs文件

<!DOCTYPE html><html>  <head>    <title>用户登录</title>    <link rel='stylesheet' href='/stylesheets/style.css' />    <link rel='stylesheet' href='/stylesheets/bootstrap.css' />    <link rel='stylesheet' href='stylesheets/bootstrap-theme.css'>  </head>  <body>    <h1>登录demo</h1>    <form action="/login" method="post" class="form-horizontal" role="form" style="width: 400px;">      <div class="form-group">        <label for="firstname" class="col-sm-4 control-label">账号：</label>        <div class="col-sm-8">          <input type="text" class="form-control" id="username" name="username" placeholder="请输入账号">        </div>      </div>      <div class="form-group">        <label for="lastname" class="col-sm-4 control-label">密码：</label>        <div class="col-sm-8">          <input type="password" class="form-control" id="password" name="password" placeholder="请输入密码">        </div>      </div>      <div class="form-group">        <div class="col-sm-offset-4 col-sm-8">          <button type="submit" class="btn btn-success">登录</button>        </div>      </div>    </form>  </body>  <script src="/javascripts/jquery.js"></script>  <script src="/javascripts/bootstrap.js"></script></html>

登录接口

修改routes（路由）目录下index.js文件，添加以下内容

//登录接口router.post('/login', function(req, res, next) {  var name = req.body.username;  var pwd = req.body.password;  var mysql = require('mysql');  //配置连接  var connection = mysql.createConnection({    host: 'localhost',//主机地址    user: 'root',//登录名    password: '',//密码，我这里是空    database:'nodejsdb'//数据库  });  //输入验证  if(!name || name == "") {    console.log("用户名不能为空");    res.send('用户名不能为空');    return;  }  if(!pwd || pwd == "") {    console.log("密码不能为空");    res.send('密码不能为空');    return;  }  //查库比较  connection.connect();  connection.query('SELECT COUNT(*) checkNum FROM `t_user` WHERE name = \''+name+'\' AND psw =\''+ pwd +'\'', function(err, rows, fields) {    if (err) throw err;    var checkNum = rows[0].checkNum;    console.log('结果为: ', rows[0].checkNum);    if(checkNum == 0){      console.log('账号或密码不正确');      res.send('账号或密码不正确');    }else{      console.log('登录成功');      //返回结果      res.send('登录成功，账号密码为：'+name+"---"+pwd);    }  });  //关闭连接  connection.end();});

页面及效果

示例中使用的是res.send()方法输出一段字符串
登录页面

登录成功页面

登录失败提醒

参考

express中文api（感谢博主分享）：http://blog.csdn.net/zhx6044/article/details/50179607

0 0