node.js学习笔记(3)-node.js结合mysql数据库实现的web项目中常见功能--登录验证、session传值、拦截器、ajax传值等

最新推荐文章于 2025-07-05 11:51:52 发布

原创最新推荐文章于 2025-07-05 11:51:52 发布 · 3.7k 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#bootstrap #mysql #node.js #数据库 #ajax

nodejs 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一个使用Node.js实现的基本登录系统的开发过程。该系统包括登录验证、session管理、拦截器等功能，并通过ajax进行数据交互。文章提供了项目结构、开发环境配置及核心代码示例。

目前实现的功能有：

登录验证、session传值、拦截器、ajax传值等。项目虽不完善，但是web项目常见的功能都已经实现

项目下载地址：http://download.csdn.net/detail/liuwu0720/7044589

1、先看一下整个项目结构

访问：localhost:3000进入登录页面

随便输入用户名和密码提示错误

输入正确的用户名及密码后显示用户的昵称

直接访问localhost:3000/main提示未登录

2、本人开发环境如下：

win7 64位

mysql 5.6

node.js node.js v0.10.26

开发工具：webstorm 7

3、主要文件：app.js

/**
 * Module dependencies.
 */

var express = require('express')
    , routes = require('./routes')
    , user = require('./routes/user')
    , http = require('http')
    , path = require('path')
    , ejs = require('ejs')
    MySQlSessionStore = require("connect-mysql-session")(express);

var app = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.engine('.html', ejs.__express);
app.set('view engine', 'html');// app.set('view engine', 'ejs');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.cookieParser());
app.use(express.cookieSession({secret : 'blog.fens.me'}));
app.use(express.session({
    secret : 'blog.fens.me',
    store: new MySQlSessionStore(),
    cookie: { maxAge: 90000 } // expire session in 15 min or 900 seconds
}));
app.use(function(req, res, next){
    res.locals.user = req.session.user;
    var err = req.session.error;
    delete req.session.error;
    res.locals.message = '';
    if (err) res.locals.message = '<div class="alert alert-error">' + err + '</div>';
    var welcome="";
    next();
});
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

// development only
if ('development' == app.get('env')) {
    app.use(express.errorHandler());
}

//basic
//app.get('/', routes.index);
app.get('/', routes.login);
app.post('/', routes.doLogin);
app.get('/main', routes.main);
app.post("/checkuser",routes.check);

app.get('/users', user.list);

http.createServer(app).listen(app.get('port'), function(){
    console.log('Express server listening on port ' + app.get('port'));
});

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="shortcut icon" href="images/favicon.ico">

    <title>Signin Template for Bootstrap</title>

    <!-- Bootstrap core CSS -->
    <link href="stylesheets/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <script type="text/javascript" src="javascripts/jquery.js"></script>
    <script type="text/javascript" src="javascripts/bootstrap.min.js"></script>
    <style type="text/css">
        body{
            background-color: #00FF99;
        }
    </style>

</head>

<body>

<div class="container" style="width: 500px; height:500px;margin-top: 50px;background-color: #f5f5f5">
    <form class="form-signin" role="form" method="post" >
        <fieldset>
            <legend>用户登陆</legend>
            <%- message %>
            <h2 class="form-signin-heading" id="message">Please sign in</h2>
            <input type="text" class="form-control" placeholder="输入用户名" required autofocus name="username" id="usename" onblur="checkuser()"><br/>
            <input type="password" class="form-control" placeholder="输入密码" required   name="password">
            <label class="checkbox">
                <input type="checkbox" value="remember-me"> Remember me
            </label>
            <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
        </fieldset>
    </form>

</div> <!-- /container -->

<script type="text/javascript">

     function checkuser(){
         var userName = $("#usename").val();

         $.ajax({
             async:true,
             data:{userName:userName},
             url:"/checkuser",
             dataType:"json",
             type:"post",
             success:function(data){

             }
         })
     };


</script>
</body>
</html>

main.html

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   
</head>


<body>

<div align="center"
     style="position: relative; width: 1000px; height: 600px; margin: 0 auto; cursor: pointer;">
  
  <h2>欢迎：<%- welcome %></h2>

</body>
</html>

package.json

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "3.4.8",
    "ejs": "*"
  }
}

index.js(路由控制关键)

/*
 * GET home page.
 */

exports.main = function(req, res){
    console.log(req.session.user);

    if(!req.session.user){
        req.session.error='请先登录';
        res.redirect('/');
    }else{

        res.render('main', { title: 'index' });
    }

};

exports.login = function(req,res){
    res.render("login",{title:'login'});
};
exports.doLogin = function(req, res){
    var mysql = require('mysql');

    var conn = mysql.createConnection({
        host: 'localhost',
        user: 'root',
        password: '',
        database:'nodejs',
        port: 3306
    });
    conn.connect();
    var user = req.body.username;
    var pwd = req.body.password;

    var selectSQL = "select * from t_user where name = '"+user+"' and password = '"+pwd+"'";
    conn.query(selectSQL,function (err, data) {
        if (err) console.log(err);

        console.log("SELECT ==> "+data);
        if(data==""||data==null){
           req.session.error='用户名或密码不正确';
            res.redirect('/');
        }else{
            req.session.user = data[0].name;
            welcome = data[0].nickname;
            //res.locals.welcomer=data[0].id;
            res.redirect('/main');
        }
    });
    conn.end();

};
exports.check = function(req,res){
   // var queryObj = {userName: req.params.userName};
    console.log(req.body.userName+"--------------------------");
}

其它相关js,css样式文件请下载源代码
项目下载地址：http://download.csdn.net/detail/liuwu0720/7044589