初步使用Express+Mysql异步读取数据展示页面

通过上面3步的简要学习，学会了如何使用jade模版编写动态页面，同时也学会了如何使用mysql数据库。今天实现一个简单的例子，结合express和mysql，从数据库中取出数据，最后在前台页面展示出来。

下面进入正题，通过Express+Mysql实现异步读取数据并展示在页面中，分为下面几步:

1. 建立数据访问对象文件

也就是常说的DAO（data access object）,在项目目录中，新建db文件夹，放访问数据库的相关文件，在db目录中新建db.js，其中代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
var mysql = require('mysql');
var options = {
  host: 'localhost',
  user: 'lupeng',
  password: '080910',
  database: 'myapp'
}
exports.createConn = function (){
  var client = mysql.createConnection(options);
  return client;
}
exports.getUsers = function (client,callback){
  var selectstatement = 'select * from user';
  client.query(selectstatement, function(errs,rows,fields){
      if (errs){
        callback(errs);
      }
      if (rows){
        console.log(rows);
        callback(rows);
    }
  });  
}

基本上是标准的一套代码，连接数据库方法，查询数据方法，当然实现更复杂的功能，会利用到数据池以及更多SQL。

上述代码简单实现了两个方法，一个是获取数据库对象createConn，一个是获取用户的方法getUsers。注意得到数据库数据后，作为参数赋予回调函数callback。

2. 编辑路由方法

当访问到某个路径的时候，查询数据库，并返回结果，最终通过res对象将内容发送到客户端上。app.js中编写路由方法如下：

1
2
3
4
5
6
7
8
9
10
var db = require('../db.js');
// ... 省略
app.get('/',function(req,res){
  var client = db.createConn();
  db.getUsers(client,function(results){
    if(results){
      res.render('index',{results: results});
    }
  });
});

首先调用createConn方法获取数据库对象client，然后调用getUsers方法取得数据，实现回调函数，将数据回传回来，最后通过res对象发送至前台页面。

3. view模版

res对象渲染index页面，最终显示在前端。这里使用的是jade模版引擎，下面看看index.jade示例代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
doctype html
html
  head
    title= title
    link(href='/bootstrap.min.css',rel='stylesheet')
  body
    .container
      .row
        h1 读取用户数据库
          small Mysql
        .table-responsive
            table.table
              thead
                tr
                  th ID
                  th 用户名
                  th 密码
                tbody
                  each item in results
                    tr
                      td= item.id
                      td= item.username
                      td= item.password

前台显示如下图，一个打印了数据库数据的简单页面。

当然前提要在数据库中新建一个myapp的数据库，在myapp中新建user表。

总结

  1. 异步读取数据库内容后，将数据作为参数赋予回调函数；
  2. 路由模块中通过实现回调函数获取数据库数据，最终显示在前台页面；
技术, Node
建站, Express, Mysql