nodeJS快速建站

发表于   |   分类于   |     |   阅读次数  

nodeJS
nodeJS安装指引
前往nodeJS官网下载相应的版本并安装，也可参考菜鸟教程上详尽的安装明细。
安装成功后，windws下cmd打开终端，键入命令

1
2
C:\Users\admin> node -v
v4.4.7

当显示相应版本时则说明已成功配置node环境。可以学习菜鸟教程上的demo学着做出一些小效果，在敲打实例的过程中熟悉nodeJS基础。当然由于windows的终端很不友好，这里推荐使用Linux来学习nodeJS，如果不喜欢Linux，那最好还是能给自己的windows安装git来使用其git bash模拟终端。

express框架

当熟悉了nodeJS基本操作后，我们开始学习express框架。express是node官方唯一指定的node框架。可以用来快速搭建一个后台系统。最快上手nodeJS的方法可以是拿自己以往的项目进行nodeJS的改造。这里lz选择了重新搭建一个音乐素材的网站，改编自CloudMusic，在前面的文章中貌似曾提过它。这个项目的代码逻辑清晰度还是可以的（可辨认的）。

首先，我们新建一个项目文件夹，并初始化。

1
2
3
$ mkdir app
$ cd app
$ npm init

安装express并将其保存到package.json中：

1
$ npm install express --save

以上命令会将 Express 框架安装在当前目录下的 node_modules 目录中， node_modules 目录下会自动创建 express 目录。以下几个重要的模块是需要与 express 框架一起安装的：

1
2
3
$ npm install body-parser --save
$ npm install cookie-parser --save
$ npm install multer --save

第一个express实例
我们使用express来输出hello world，以下实例中我们引入了 express 模块，并在客户端发起请求后，响应 “Hello World” 字符串。
创建 app.js 文件，代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// app.js
var express = require('express');
var app = express();

app.get('/', function (req, res) {
   res.send('hello world');
})

var server = app.listen(8080, function () {

  var host = server.address().address
  var port = server.address().port

  console.log("运行成功，访问地址为 http://%s:%s", host, port)

})

运行以上代码

1
$ node app.js

打开浏览器127.0.0.1:8080，可看到hello world已经显示了出来。相信nodeJS的基础练习已经让你熟悉了如何用node启动localhost服务了。到目前为止，express的安装和使用都没有问题了，那接下来我们就罗列一下，使用express在建站过程中所需的知识点。

请求和响应

Express 应用使用回调函数的参数： request 和 response 对象来处理请求和响应的数据。

1
2
3
4
5
6
7
8
9
10
11
// 通过监听url路径的不同输入来给出不同的响应
app.get('/index', function (req, res) {
   // ....do something
   
   // 当访问路径为localhost/index时，渲染index.html
   res.sendFile(__dirname + "/index.html"); 
});
app.get('/user', function (req, res) {
   // ....do another thing
   res.sendFile(__dirname + "/user.html");
});

静态文件的处理

我们项目中的css、image和js等静态文件都需要做静态指向的处理，否则将无法被成功加载。我们使用以下代码来指定静态文件夹路径：

1
app.use(express.static('public'));

public中包含了js、css和image这三个文件夹。到目前为止，我们项目的目录大致如下：

1
2
3
4
5
6
7
- node_module
- public
	- css
	- js
	- image
package.json
app.js

我们再继续完善该目录:

1
2
3
4
5
6
7
8
9
10
11
12
13
- node_module
- public
	- css
	- js
	- iamge
- view
	index.html
	user.html
- Lib
	- jquery
	- seajs
package.json
app.js

使用路由来实现页面跳转

我们修改app.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
27
28
29
30
31
32
33
// app.js
const homePath = "/views/Home/";	// html文件路径
var express = require('express');	
var app = express();

// 静态文件路径
app.use(express.static('public'));	
app.use(express.static('Lib'));		

// 几个路由：
app.get('/', function(req, res) {
    res.sendFile(__dirname + "/index.html");
});

app.get(homePath + 'index', function (req, res) {
    res.sendFile(__dirname + homePath + "index.html");
});

app.get(homePath + 'login', function (req, res) {
    res.sendFile(__dirname + homePath + "login.html");
});

app.get(homePath + 'my', function (req, res) {
    res.sendFile(__dirname + homePath + "my.html");
});

app.get(homePath + 'reg', function (req, res) {
    res.sendFile(__dirname + homePath + "reg.html");
});

app.get(homePath + 'result', function (req, res) {
    res.sendFile(__dirname + homePath + "result.html");
});

完成了页面跳转，接下来是建立后台接口和sql配置。我们再完善目录

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
- conf		// 数据库配置
	db.js 	
- dao		// 一些后台接口
	musicDao.js
	musicSqlMapping.js
	newsDao.js
	newsSqlMapping.js
	userDao.js
	userSqlMapping.js
- Lib
- node_modules
- public
- routes
- util
- view
app.js
index.html
package.json

mysql连接

这里数据库选择了mysql，适合入门使用，我们为项目安装mysql模块：

1
$ npm install mysql --save

编辑 conf 文件夹下的db.js，写进数据库配置

1
2
3
4
5
6
7
8
9
10
// db.js
// 数据库配置
module.exports = {
    mysql: {
        host: '127.0.0.1',
        user: 'root',
        password: '',
        database: 'music'	// 数据库名
    }
};

启用mysql服务，可以运行xampp或wamp等程序来模拟。然后在dao/userDao.js中连接mysql并编写我们的第一个简单后台接口。

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
// userDao.js
// 实现与MySql交互
var mysql = require('mysql');
var util = require('../util/util'); // util模块中，实现了一个简单的json输出方法
var $conf = require('../conf/db');
var $sql = require('./userSqlMapping');

// 使用链接池，提升性能
var pool = mysql.createPool($conf.mysql);

module.exports = {
    checkLogin: function (req, res) {
        pool.getConnection(function (err, connection) {
            if (err) console.log("POOL ===> " + err);
            var param = req.query || req.params;
            connection.query($sql.checkLogin, [param.user, param.pwd], function (err, rows) {
                if (rows.length > 0) {
                    util.jsonWrite(res, rows);
                } else {
                    res.json({'err': '1'});
                }
                connection.release();
            });
        });
    }
}

dao/userSqlMapping.js则是基本的sql语句，我们把sql语句写在sql mapping中，方便维护。

1
2
3
4
// CRUD SQL语句
module.exports = {
	checkLogin: 'SELECT email, pwd, id FROM app_User WHERE email=? and pwd=?'
}

接口写好了，我们在app.js中定义访问这个接口的路径

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const homePath = "/views/Home/";
var express = require('express');
var app = express();
var userDao = require('./dao/userDao');	//引入userDao模块

app.use(express.static('public'));
app.use(express.static('Lib'));

// ... 一些路由

// 接口路径：
app.get('/controller/checkLogin', function (req, res) {
    userDao.checkLogin(req, res);
});

到此我们已经打通了前端和后台，成功地连接上了数据库。项目已经搭建起来，剩下的完善更多接口和js功能也就不在话下了。