首先,放上项目github地址:https://github.com/codethereforam/express-mysql-demo

一、前言

之前学的java,一直用的ssm框架写后台。前段时间接触到node.js,于是花了两天时间学了一下node.js并写了一个CRUD简单示例。由于前几天一直学用github pages搭建博客,一直没时间写README,今天有空补了上来。

下面来内容自于项目的README

二、项目介绍

基于node.js + express + mysql实现的restful风格的CRUD简单示例

2.1 组织结构

├── app.js -- 应用配置
├── bin
│ └── www -- 项目运行脚本
├── conf
│ └── mysqlConf.js -- mysql配置文件
├── dao
│ ├── userDAO.js -- 封装和数据库的交互
│ └── userSqlMap.js -- SQL语句封装
├── model
│ └── result.js -- 返回结果对象封装
├── package.json -- 依赖模块
├── project-datamodel
│ └── user.sql -- 数据库脚本
├── public -- 前端静态页面
│ ├── add.html
│ ├── css
│ │ └── style.css
│ ├── detail.html
│ ├── index.html
│ └── modify.html
└── routes
└── users.js -- 用户操作路由及业务逻辑

2.2 模块依赖

www -> app.js -> users.js ->  userDAO.js -> mysqlConf.js & userSqlMap.js

2.3 技术选型

后端技术

  • node.js
  • express

前端技术

  • angular.js

三、环境搭建

四、项目运行

  1. 下载代码并部署
git clone https://github.com/codethereforam/express-mysql-demo.git
cd express-mysql-demo && npm install #安装部署依赖的包
  1. 新建express-mysql-demo数据库,导入project-datamodel文件夹下的user.sql

  2. 修改conf/mysqlConf.js中数据库配置信息

  3. 启动

# 切换到项目根路径
npm start
  1. 打开首页: http://localhost:8888

五、开发过程及代码分析

关于restful,可参考阮一峰的两篇文章:

我使用的IDE是IDEA,安装"NodeJS"插件后依次点击

File -> New Project -> Node.js and NPM -> Node.js Express App

IDEA默认使用express-generator生成项目结构。

新建数据库"express-mysql-demo":

create database `express-mysql-demo`;

新建user表:

CREATE TABLE `express-mysql-demo`.`user` (
`id` INT UNSIGNED NOT NULL AUTO_INCREMENT,
`username` VARCHAR(45) NOT NULL,
`password` VARCHAR(45) NOT NULL,
PRIMARY KEY (`id`))
DEFAULT CHARACTER SET = utf8mb4;

表结构:

+----------+------------------+------+-----+---------+----------------+
| Field | Type | Null | Key | Default | Extra |
+----------+------------------+------+-----+---------+----------------+
| id | int(10) unsigned | NO | PRI | NULL | auto_increment |
| username | varchar(45) | NO | | NULL | |
| password | varchar(45) | NO | | NULL | |
+----------+------------------+------+-----+---------+----------------+

mysql配置文件conf/mysqlConf.js:

module.exports = {
mysql: {
host: 'localhost',
user: 'root',
password: '',
database:'express-mysql-demo',
// 最大连接数,默认为10
connectionLimit: 10
}
};

SQL语句封装模块dao/userSqlMap.js:

var userSqlMap = {
add: 'insert into user(username, password) values(?, ?)',
deleteById: 'delete from user where id = ?',
update: 'update user set username=?, password=? where id=?',
list: 'select * from user',
getById: 'select * from user where id = ?'
};

封装返回结果对象model/result.js:

exports.createResult = function(success, data) {
var result = {};
result.success = success;
result.data = data;
return result;
};

我这里使用了工厂方法创建结果对象,对象有两个属性,success代表用户操作成功或失败,data存放后台要返回的数据。

下面分析修改用户部分信息的相关代码,全部的增删改查代码请将项目clone下来查看。

封装和数据库的交互模块dao/userDAO.js:

var pool = mysql.createPool(mysqlConf.mysql);
module.exports = {
getById: function (id, callback) {
pool.query(userSqlMap.getById, id, function (error, result) {
if (error) throw error;
console.log(result[0]);
callback(result[0]);
});
},update: function (user, callback) {
pool.query(userSqlMap.update, [user.username, user.password, user.id], function (error, result) {
if (error) throw error;
callback(result.affectedRows > 0);
});
}
};

这里使用了连接池,重复使用数据库连接,而不必每执行一次CRUD操作就获取、释放一次数据库连接,从而提高了对数据库操作的性能。

用户操作路由及实现业务逻辑routes/users.js:

/* patch users */
router.patch('/:id', function (req, res) {
console.log('patch users called');
userDAO.getById(req.params.id, function (user) {
var username = req.body.username;
if(username) {
user.username = username;
}
var password = req.body.password;
if(password) {
user.password = password;
}
console.log(user);
userDAO.update(user, function (success) {
var r = result.createResult(success, null);
res.json(r);
});
});
});

router根据不同的HTTP请求方法和访问路径执行相应的回调函数,回调函数中先记录日志,然后检查用户传过来的数据,接着调用userDAO的相应CRUD方法,最后返回一个JSON对象给前端。这里修改用户部分信息对应HTTP方法是PATCH,而修改全部信息对应的是PUT。

应用配置app.js中配置用户操作相关的路由:

app.use('/users', users);

前端public/index.html中与后台交互的JS代码:

(function (window) {
window.angular.module('list', [])
.controller('listCtrl', function ($scope, $http) {
$scope.doPatch = function (id) {
var data = JSON.stringify({
password: document.getElementById("pwd" + id).value
});
$http.patch("/users/" + id, data)
.then(function (response) {
console.debug(response.data.success);
}, function (err) {
alert(err);
});
};
});
})(window);

前端使用angualr.js,ajax异步调用后端restful API,然后解析后台返回的JSON对象在界面上展示。

nodejs+express+mysql实现restful风格的增删改查示例的更多相关文章

  1. 进入全屏 nodejs+express+mysql实现restful风格的增删改查示例

    首先,放上项目github地址:https://github.com/codethereforam/express-mysql-demo 一.前言 之前学的java,一直用的ssm框架写后台.前段时间 ...

  2. Nodejs+Express+Mysql实现简单用户管理增删改查

    源码地址 https://github.com/king-y/NodeJs/tree/master/user 目录结构 mysql.js var mysql = require('mysql'); v ...

  3. node+express+mysql实现简单的数据增删改查

    前提 电脑已经安装了node,express,mysql. 实现步骤 1.新建数据库表 附数据表结构: 2.创建exprss项目 express -e myapp  新建一个以ejs为模板的expre ...

  4. SpringMVC 之 RESTful 风格的增删改查

    1. 视图和视图解析器 视图解析器 请求处理方法执行完成后,最终返回一个ModelAndView对象,对于返回String,View 或 ModelMap 等类型的处理方法, SpringMVC 也会 ...

  5. MySQL数据库之表的增删改查

    目录 MySQL数据库之表的增删改查 1 引言 2 创建表 3 删除表 4 修改表 5 查看表 6 复制表 MySQL数据库之表的增删改查 1 引言 1.MySQL数据库中,数据库database就是 ...

  6. MYSQL - database 以及 table 的增删改查

    MYSQL - database 以及 table 的增删改查 MySQL的相关概念介绍 MySQL 为关系型数据库(Relational Database Management System), 这 ...

  7. 使用JDBC分别利用Statement和PreparedStatement来对MySQL数据库进行简单的增删改查以及SQL注入的原理

    一.MySQL数据库的下载及安装 https://www.mysql.com/ 点击DOWNLOADS,拉到页面底部,找到MySQL Community(GPL)Downloads,点击 选择下图中的 ...

  8. springboot(十五):springboot+jpa+thymeleaf增删改查示例

    这篇文章介绍如何使用jpa和thymeleaf做一个增删改查的示例. 先和大家聊聊我为什么喜欢写这种脚手架的项目,在我学习一门新技术的时候,总是想快速的搭建起一个demo来试试它的效果,越简单越容易上 ...

  9. SpringMVC之简单的增删改查示例(SSM整合)

    本篇文章主要介绍了SpringMVC之简单的增删改查示例(SSM整合),这个例子是基于SpringMVC+Spring+Mybatis实现的.有兴趣的可以了解一下. 虽然已经在做关于SpringMVC ...

随机推荐

  1. 数学之美?编程之美?数学 + 编程= unbelievable 美!

    欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 作者:Rusu 导语 相信大家跟我一样,偶尔会疑惑:曾经年少的时候学习过的那么多的复杂的数学函数,牛逼的化学方程式,各种物理原理.公式,到底有 ...

  2. 【SqlServer系列】语法定义符号解析

    1   概述 在数据库函数定义中,经常用到这些符号:<>,::=,[],{},|,..,(),!!   .这篇文章简要概述这些符号. 2   具体内容 2.1  <> < ...

  3. bzoj 4539: [Hnoi2016]树

    Description 小A想做一棵很大的树,但是他手上的材料有限,只好用点小技巧了.开始,小A只有一棵结点数为N的树,结 点的编号为1,2,-,N,其中结点1为根:我们称这颗树为模板树.小A决定通过 ...

  4. Python学习(三):迭代器、生成器、装饰器、递归、算法、正则

    1.迭代器 迭代器是访问集合的一种方式,迭代对象从集合的第一个元素开始访问,直到元素被访问结束,迭代器只能往前不能后退,最大的优点是不要求事先准备好整个迭代过程中的元素,这个特点使得它特别适合用于遍历 ...

  5. React Native出现"Native module cannot be null"问题

    经查跟PushNotification有关,需要手动完成Linking. 两步解决此问题: 配置Linking Libraries:https://facebook.github.io/react-n ...

  6. centos 7 部署 open-falcon 0.2.0

    =============================================== 2017/12/06_第2次修改                       ccb_warlock 更 ...

  7. Django2.0中文文档

    title: Django2.0中文文档 tags: Python,Django,入沐三分 grammar_cjkRuby: true --- Django2.0版本已经发布了,我们先来看一个图片 从 ...

  8. xlwt 官网的例子

    from time import * from xlwt.Workbook import * from xlwt.Style import * style = XFStyle() wb = Workb ...

  9. js间隔几秒弹出一次联系框

    运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-3-sec-alert-dlg-codes/ 具体代码如下: <html> < ...

  10. precmd:6: job table full or recursion limit exceeded

    使用GDC Data Transfer Tool下载10999个isoforms.quantification.txt文件时,写了shell循环的小脚本: cat all_id_file |while ...