资讯专栏INFORMATION COLUMN

初识NodeJS服务端开发(Express+MySQL)

dayday_up / 1255人阅读

摘要:对前端来说无疑具有里程碑意义,在其越来越流行的今天,掌握已经不再是加分项,而是前端攻城师们必须要掌握的技能。更多的功能如日志,自动化测试等,等待大家去解锁,愿玩得愉快转自初识服务端开发

NodeJS对前端来说无疑具有里程碑意义,在其越来越流行的今天,掌握NodeJS已经不再是加分项,而是前端攻城师们必须要掌握的技能。本文将与同志们一起完成一个基于Express+MySQL的入门级服务端应用,即可以对数据库中的一张表进行简单的CRUD操作。但本人还是斗胆认为,通过这个应用,可以让没怎么接触后端开发的同志对使用Node进行后端开发有一个大致了解。

Express工程环境准备

安装express,和express项目种子生成器(什么?你问第1步为什么不是安装NodeJS,我也只能呵呵..)

安装express

npm install express -g

安装express

npm install express-generator -g

创建工程。进入工程目录,运行命令

express projectName

expresst项目种子生成器会帮我们生成express相应的工程结构,如下

/bin: 用于应用启动

/public: 静态资源目录

/routes:可以认为是controller(控制器)目录

/views: jade模板目录,可以认为是view(视图)目录

app.js 程序main文件

进入工程,安装依赖,然后启动应用

在工程根目录,使用npm install安装依赖,使用npm start启动应用。完成后,你在命令行工具里会看出如下界面,在浏览器中访问会得到我们应用的默认页面

 

MySQL环境准备

当然,首先你要准备好MySQL环境。可以参看http://supportopensource.iteye.com/blog/1415527进行安装,同时也建议安装一个数据库管理工具,如navicat for mysql,方便操作

创建表

MySQL安装好了后,进入到数据库,创建要用到的表(如user), 结构如下

安装Node的MySQL驱动(请允许装X一下…)

在package.json的dependencies中新增, “mysql” : “latest”, 并执行npm install安装依赖

编写相关代码,整合Express+MySQL

首先,我们先建几个目录,简单分下层(看出我还是很用心木有?)

在工程根目录新增三个目录:

util – 工具方法

conf – 配置

dao – 与数据库交互

完成后的工程结构

2.在conf目录中,编写mySQL数据库连接配置

// conf/db.js
// MySQL数据库联接配置
module.exports = {
    mysql: {
        host: "127.0.0.1", 
        user: "root",
        password: "",
        database:"test", // 前面建的user表位于这个数据库中
        port: 3306
    }
};

编写CRUD SQL语句

// dao/userSqlMapping.js
// CRUD SQL语句
var user = {
insert:"INSERT INTO user(id, name, age) VALUES(0,?,?)",
update:"update user set name=?, age=? where id=?",
delete: "delete from user where id=?",
queryById: "select * from user where id=?",
queryAll: "select * from user"
};

module.exports = user;

增加路由及实现数据库的CRUD

以C(新增)的具体实现举例,在/routes/users.js 中增加一个路由

// 增加用户
router.get("/addUser", function(req, res, next) {
    userDao.add(req, res, next);
});

在userDao中实现add方法

// dao/userDao.js
// 实现与MySQL交互
var mysql = require("mysql");
var $conf = require("../conf/conf");
var $util = require("../util/util");
var $sql = require("./userSqlMapping");

// 使用连接池,提升性能
var pool  = mysql.createPool($util.extend({}, $conf.mysql));

// 向前台返回JSON方法的简单封装
var jsonWrite = function (res, ret) {
    if(typeof ret === "undefined") {
        res.json({
            code:"1",
            msg: "操作失败"
        });
    } else {
        res.json(ret);
    }
};

module.exports = {
    add: function (req, res, next) {
        pool.getConnection(function(err, connection) {
            // 获取前台页面传过来的参数
            var param = req.query || req.params;

            // 建立连接,向表中插入值
            // "INSERT INTO user(id, name, age) VALUES(0,?,?)",
            connection.query($sql.insert, [param.name, param.age], function(err, result) {
                if(result) {
                    result = {
                        code: 200,
                        msg:"增加成功"
                    };    
                }

                // 以json形式,把操作结果返回给前台页面
                jsonWrite(res, result);

                // 释放连接 
                connection.release();
            });
        });
    }
};

测试整合是否成功

因为前面实现的是一个get请求的add方法, 所以可以在浏览器中直接使用地址访问,进入路由, http://localhost:3000/users/addUser?name=xyz&age=18.如果你得到如下JSON返回或看到数据表中有上面的数据插入,表示整合成功了

同理,实现CRUD其它的方法,最终完整的的routes/user.js为:

var express = require("express");
var router = express.Router();

var userDao = require("../dao/userDao");

/* GET users listing. */
router.get("/", function(req, res, next) {
res.send("respond with a resource");
});

// 增加用户
//TODO 同时支持get,post
router.get("/addUser", function(req, res, next) {
userDao.add(req, res, next);
});

router.get("/queryAll", function(req, res, next) {
userDao.queryAll(req, res, next);
});

router.get("/query", function(req, res, next) {
userDao.queryById(req, res, next);
});

router.get("/deleteUser", function(req, res, next) {
userDao.delete(req, res, next);
});

router.post("/updateUser", function(req, res, next) {
userDao.update(req, res, next);
});

module.exports = router;

完整的userDao.js为

// dao/userDao.js
// 实现与MySQL交互
var mysql = require("mysql");
var $conf = require("../conf/db");
var $util = require("../util/util");
var $sql = require("./userSqlMapping");

// 使用连接池,提升性能
var pool  = mysql.createPool($util.extend({}, $conf.mysql));

// 向前台返回JSON方法的简单封装
var jsonWrite = function (res, ret) {
    if(typeof ret === "undefined") {
        res.json({
            code:"1",
            msg: "操作失败"
        });
    } else {
        res.json(ret);
    }
};

module.exports = {
    add: function (req, res, next) {
        pool.getConnection(function(err, connection) {
            // 获取前台页面传过来的参数
            var param = req.query || req.params;

            // 建立连接,向表中插入值
            // "INSERT INTO user(id, name, age) VALUES(0,?,?)",
            connection.query($sql.insert, [param.name, param.age], function(err, result) {
                if(result) {
                    result = {
                        code: 200,
                        msg:"增加成功"
                    };    
                }

                // 以json形式,把操作结果返回给前台页面
                jsonWrite(res, result);

                // 释放连接 
                connection.release();
            });
        });
    },
    delete: function (req, res, next) {
        // delete by Id
        pool.getConnection(function(err, connection) {
            var id = +req.query.id;
            connection.query($sql.delete, id, function(err, result) {
                if(result.affectedRows > 0) {
                    result = {
                        code: 200,
                        msg:"删除成功"
                    };
                } else {
                    result = void 0;
                }
                jsonWrite(res, result);
                connection.release();
            });
        });
    },
    update: function (req, res, next) {
        // update by id
        // 为了简单,要求同时传name和age两个参数
        var param = req.body;
        if(param.name == null || param.age == null || param.id == null) {
            jsonWrite(res, undefined);
            return;
        }

        pool.getConnection(function(err, connection) {
            connection.query($sql.update, [param.name, param.age, +param.id], function(err, result) {
                // 使用页面进行跳转提示
                if(result.affectedRows > 0) {
                    res.render("suc", {
                        result: result
                    }); // 第二个参数可以直接在jade中使用
                } else {
                    res.render("fail",  {
                        result: result
                    });
                }

                connection.release();
            });
        });

    },
    queryById: function (req, res, next) {
        var id = +req.query.id; // 为了拼凑正确的sql语句,这里要转下整数
        pool.getConnection(function(err, connection) {
            connection.query($sql.queryById, id, function(err, result) {
                jsonWrite(res, result);
                connection.release();

            });
        });
    },
    queryAll: function (req, res, next) {
        pool.getConnection(function(err, connection) {
            connection.query($sql.queryAll, function(err, result) {
                jsonWrite(res, result);
                connection.release();
            });
        });
    }

};

除了update测试外,其它get请求都可以直接在浏览器中使用地址+参数完成测试。为了模拟post请求,同时简单使用下jade模板(Express支持的一种模板引擎),

我们在/views目录新建三个jade文件

updateUser.jade

extends layout

block content
    h1 更新用户资料
    form(method="post", action="/p/users/updateUser")
        div.form-row
            label
                span ID:
                input(type="text",name="id")
        div.form-row
            label
                span name:
                input(type="text",name="name")
        div.form-row
            label
                span age:
                input(type="text",name="age")
        div.form-row
            input(type="submit")

suc.jade

block content
  h1 操作成功!
  pre #{JSON.stringify(result)}

fail.jade

block content
  h1 操作失败!
  pre #{JSON.stringify(result)}

以下是更新测试结果

 

 

最后,如果你使用的是idea或webStrom这样的IDE,你就不需要安装express和express项目种子生成器了。这两个IDE是可以直接创建NodeJS项目

小结:

一个Express的helloWorld就差不多完成了, 可以通过这个链接下载此例子源代码http://pan.baidu.com/s/1jGvd4Bc。更多Express的功能(如日志,自动化测试等),等待大家去解锁,愿玩得愉快!

转自 初识NodeJS服务端开发(Express+MySQL)

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/46426.html

相关文章

  • 1.3 Mysql 安装与使用-基础配置-NodeJs+Express+Mysql实战

    摘要:下载及安装下载及安装中并没有集成,需要手动安装。到这里已经配置完成,并且可以运行。相关命令设置为了更加方便使用,最好再设置一下系统环境变量,也就是让这个命令在任何路径都可以直接启动不需要输入一长串的准确路径。 下载 MySQL 及安装 1、下载 MySQL 及安装 OS X Mavericks 中并没有集成 Mysql,需要手动安装。 官网下载: http://dev.mysql.co...

    王岩威 评论0 收藏0
  • NodeJs+Express+Mysql + Vuejs 项目实战 - 大纲

    摘要:多一个技能多一条出路,祝你在自学道路上越走越好,掌握自己的核心技能,不只是优秀,还要成为不可替代的人 NodeJs+Express+Mysql + Vuejs 项目实战 最近准备写一系列文章,全面讲述如何基于NodeJs + Express + Mysql + Vuejs 从零开发前后端完全分离项目; 文笔及技术可能在某些方面欠佳,请您指正,共同学习进步 前端:Vuejs全家桶 后端:...

    noONE 评论0 收藏0
  • NodeJs+Express+Mysql + Vuejs 项目实战 - 大纲

    摘要:多一个技能多一条出路,祝你在自学道路上越走越好,掌握自己的核心技能,不只是优秀,还要成为不可替代的人 NodeJs+Express+Mysql + Vuejs 项目实战 最近准备写一系列文章,全面讲述如何基于NodeJs + Express + Mysql + Vuejs 从零开发前后端完全分离项目; 文笔及技术可能在某些方面欠佳,请您指正,共同学习进步 前端:Vuejs全家桶 后端:...

    Miracle_lihb 评论0 收藏0
  • 利用angular4和nodejs-express构建一个简单的网站(二)——设置跨域访问和安装基本

    摘要:后端程序配置因为是用自动生成的应用。允许进行跨域访问的方法,我们这里主要用到的是和两种方法。现在为止,先设置这些,后面还有具体路由的配置和认证等内容。所以,我一直用这个框架来构建网页样式。其中表的与表的设置为外键约束。 在上面一章中,我创建了前端的angular4框架程序和后端的nodejs-express框架程序,在这一章中,我准备对前后端程序进行一些简单的配置,然后将后台数据库创建...

    Jokcy 评论0 收藏0
  • 利用angular4和nodejs-express构建一个简单的网站(二)——设置跨域访问和安装基本

    摘要:后端程序配置因为是用自动生成的应用。允许进行跨域访问的方法,我们这里主要用到的是和两种方法。现在为止,先设置这些,后面还有具体路由的配置和认证等内容。所以,我一直用这个框架来构建网页样式。其中表的与表的设置为外键约束。 在上面一章中,我创建了前端的angular4框架程序和后端的nodejs-express框架程序,在这一章中,我准备对前后端程序进行一些简单的配置,然后将后台数据库创建...

    ?xiaoxiao, 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<