基于React+NodeJs+MongoDB的简易留言板(二)

上一篇我们已经用NodeJs实现了一个简易的应用服务器,可以访问静态资源以及处理GET和POST请求了。那么接下来就是对接收到的数据进行持久化了,也就是说得找个数据库存下接收到的数据,以便之后的读取。我选择了MongoDB,至于为什么,就是因为之前没用过想试试看嘛:)

MongoDB的安装和配置

本来不想写这一节的,因为网上有很多相关资料,但是写这篇文章前发现自己电脑上没装过MongoDB,下载完后又忘了怎么配置,又得去网上翻,索性还是搬运过来好了,下次找起来也方便点。以下的安装和配置都是Windows平台的,Mac高富帅们只能自己去网上找找Mac版的了:)

下载不必多说,去MongoDB官网下载对应版本即可。安装完后,开始配置MongoDB服务。

假设安装路径为D:\MongoDB,首先在D:\MongoDB下新建个data文件夹,再在data文件夹下新建一个db文件夹,用来存放相应的数据库数据。

打开CMD,cdD:\MongoDB\bin,输入mongod.exe --dbpath=d:\MongoDB\data\db来启动服务,如果提示需要--rest启动,那么就加上rest参数:mongod.exe --rest --dbpath=d:\MongoDB\data\db
ps:我之前在公司进行到这一步的时候需要带rest参数,这次在家里试没带rest参数也成功了。

接下来将MongoDB服务设置成Windows服务,并加上日志。先在data文件夹下新建log文件夹,在log文件夹中新建log.log文件。在CMD中输入mongod --dbpath=d:\MongoDB\data\db --logpath=d:\MongoDB\data\log\log.log --install

新开一个CMD,cdD:\MongoDB\bin\,输入mongo进行连接测试,成功后就都搞定了。

最后还需要一款MongoDB的图形化管理工具,MongoDB官方推荐了几款(ps:官方推荐的那个链接找不到了,找到了再补上。),从中选款喜欢的就行。入前端之前,我也算是个半吊子的Java程序猿,所以我就选了用Java写的UMongo,就是这么任性:)这款工具使用起来还是很简单的,下载完解压运行连接,一切搞定。

用NodeJs操作MongoDB

首先用npm安装MongoDB的NodeJs驱动:
npm install mongodb --save

在上一篇文章的基础上,新建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
//db.js
var MongoClient = require('mongodb').MongoClient;
var url = "mongodb://localhost:27017/msgBoard";
var documentName = "msg";

function save(data, callback) {
MongoClient.connect(url, function(err, db) {
if (err) {
console.log(err);
} else {
var collection = db.collection(documentName);

collection.insert(data, function(err, result) {
if (err) {
console.log(err);
} else {
console.log("insert success!!");
callback && callback(result);
db.close();
}
});
}
})
}

exports.save = save;

首先我们对外exportssave方法,save方法接收两个参数:datacallbackdata是要插入数据库的数据,callback就是插入操作完成后的回调函数。

接下来看怎么把数据插入到数据库中,我们用了MongoClient.connect()这个方法来建立起与数据库之间的连接,url中的mongodb://localhost:27017/为MongoDB服务器的地址,27017是默认端口,msgBoard可以看作是关系型数据库中的数据库名,而msg可以当作关系型数据库中的表。连接建立完成后,就可以通过collection.insert()来进行插入操作。

最后我们把requestHandlers.js中的save方法做些改变,让其能够把接收到的数据存入数据库:

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
//requestHandlers.js
var querystring = require("querystring");

//...

function save(request, response) {
var str = '';

request.on("data", function(chunk) {
str += decodeURIComponent(chunk);
});

request.on("end", function() {
var param = querystring.parse(str);

db.save(param, function(result) {
response.writeHead(200, {"Content-Type": "application/json"});
response.write(util.format('%j', result));
response.end();
});
});
}

//...
//

OK,启动应用,访问http://localhost:8888/index.html

点击“提交”

这个返回的就是我们提交的数据在MongoDB中保存的格式,_id是MongoDB用以区分数据的唯一编码。那么,数据是不是真的已经存进数据库了呢?用UMongo查看下:

这条就是我新添加的数据,好了,一切正常,搞定!

结束语

关于NodeJs对MongoDB的操作,我就介绍到这了,因为此次项目要用到的API都比较简单,更多信息可以查看官方文档

感觉自己写的比较乱,各位将就着看下吧:)

参考资料:
Win7下安装MongoDB——博客园-WhoAmMe
Install MongoDB on Windows

本文为原创文章,如有不足之处欢迎批评指正。
欢迎转载,转载请注明源地址:qianliwei.com/2015/01/10/react-msgboard-2/