1. 程式人生 > >nodejs+express+mongodb簡單的例子

nodejs+express+mongodb簡單的例子

簡單的介紹下node+express+mongodb這三個東西。

node
:是執行在伺服器端的程式語言,表面上看過去就是javascript一樣的東西,但是呢,確實就是伺服器語言,個人覺得在一定層次上比c靈活,java就不提了。反正你只要認為node可以幹很多事就行了,絕對不只是web開發。
express
:這貨呢,就是node的一種框架,node有很多的開源框架,express是一個大神開發的(這尊神已經移駕到go語言的開發去了)。express可以讓你更方便的操作node(因為原生的node寫起來比較麻煩,而且因為node是事件驅動的,所以有很多非同步回撥,寫多了就看著暈...)
mongodb

:這是一種非關係資料庫(nosql),太深的東西我也不清楚,反正這貨也有很強大的地方,缺點就是不適合資料一致性要求高的比如金融方面的開發。但是優點就
總結:也就是說node和mongodb組合起來特別適合一個應用場景——速度快,處理量大的情況。

下面先說說準備工作:(以windows8.1系統環境為例)
1.node:先下載安裝nodejs,下載地址http://www.nodejs.org/,安裝好了之後檢查是否在系統環境變數裡自動配置好了path,如果沒有,請把node的安裝地址配置到path裡去。然後在cmd裡敲入node,如果可以,那麼這一步ok了,很簡單吧。
2.express:這個安裝分兩種,一種是全域性安裝,一種是本地安裝。網路上說的玄乎玄乎的,但是實際操作中你會發現不同的系統環境會出現問題,比如win8.1中文使用者名稱情況下,你得改變npm的全域性路徑(npm是node模組包管理程式,在你安裝好node的時候已經自帶npm了),操作:
prefix = 自定義模組目錄


cache = 自定義快取目錄
接著安裝express(新版本4.X以上要安裝express-generator)
npm i -g express(舊版本npm i -g express+版本號
npm i -g express-generator
(如果想本地安裝在和npm同一個目錄下,先cd到node_modules目錄,再使用npm i express-generator命令,然後再將node_modules目錄下的./bin配置到環境變數path裡去)
測試:
express -V 成功的話會顯示版本號
3.mongodb:這個資料庫安裝很簡單,下載地址http://www.mongodb.org/
。安裝好了,就在cmd裡cd到mongodb安裝目錄下的bin目錄,然後敲命令:
mongod --dbpath="mongodb安裝目錄\data" --logpath="mongodb安裝目錄\log\log.txt" --install --serviceName MongoDB --serviceDisplayName MongoDB
操作完,你會發現,你的電腦的服務裡多了一個MongoDB服務,沒錯,就是它,然後你執行這個服務就行了。

正題:搭建簡單的node+express+mongodb專案

先在cmd控制檯裡cd到一個目錄下面,記住這你的workspace,然後是用是用express建立一個app專案
express hello-world -e (-e表示支援ejs模板引擎,預設是jaden。什麼事模板引擎,比如jsp...太深的我也不懂。本人比較擅長html原生的東西,像這種模板引擎我也是第一次使用,也蠻方便的哦,不過在我看來,沒啥用, 我不需要,但是可能你需要...)
然後我們再下載依賴包
npm i (這樣就會自動將專案需要的依賴modules安裝到專案的modules裡去了)
我們cd到hello-world目錄下,是用命令
npm start 啟動專案(也可以是node ./bin/www,舊版本直接node app.js,因為具體要看package.json裡的啟動配置了)
我們可以在瀏覽器位址列裡敲入 http://127.0.0.1:3000/ 這就是你的第一個express建立的node app。
是不是很哈皮。。。

我們研究下express建立專案
你需要了解的專案主要目錄為:routes和views,你最好再在專案裡新建一個目錄叫models(作用後面講)
routes裡index.js配置的都是get和post請求的路徑對映關係,很簡單的哦。
views裡index.ejs就相當於一個html檔案,裡面就是一些html標籤和<%%>標籤,感覺和jsp差不多哦。
看起來不錯的樣子,標準的MVC框架(models裡放模型,views裡面放展示,routes裡面放控制)

上面我們已經生成好了app原型,接著我們設計資料庫
cmd命令列裡:
mongo //進入資料庫
use hello-world //建立專案資料庫
db.addUser("shuaige", "123456") //給這個資料庫建立了一個叫帥哥的賬號,密碼123456 (但是我覺得可能我理解的不到位,你也可以不做這個操作)
然後,我們就為這個hello-world資料庫建立collection(collection就相當於oracle和mysql裡的table)
db.createCollection("users") //建立一個集合,也就是表
db.users.insert({userid: "admin", password: "123456"}) //給users裡新增一個文件,也就是一條記錄賬號admin,密碼123456
ok,現在檢查一下:
db.users.find() //如果看到你剛剛新增的文件記錄,就ok咯

好簡單的資料庫集合以及文件設定好,我們就回到express建立的node專案裡,我們需要:   

在models下建立一個user.js,作為實體類對映資料庫的users集合 
在views下做幾個頁面(可以用ejs也可以用html,我就用ejs吧)
在routes下的index.js配置路由,也就是請求對映處理

1在models下建立一個user.js,作為實體類對映資料庫的users集合 

user.js

var mongoose = require("mongoose");	//	頂會議使用者元件
var Schema = mongoose.Schema;	//	建立模型
var userScheMa = new Schema({
	userid: String,
	password: String
});	//	定義了一個新的模型,但是此模式還未和users集合有關聯
exports.user = mongoose.model('users', userScheMa); //	與users集合關聯


2在views下面建index.ejs, errors.ejs, login.ejs, logout.ejs, homepage.ejs。 (index是自帶的,不用建)

index.ejs 

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1>Hello World</h1>
    <p>Welcome to <%= title %></p>
    <p><a href="login">登陸</a></p>
  </body>
</html>
login.ejs
<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1>Hello World</h1>
    <p>Welcome to <%= title %></p>
    <form action="homepage" method="post">
	    <p>
	    	<span>userId:</span>
	    	<br>
	    	<input id="userid" name="userid" type="text">
	    </p>
	    <p>
	    	<span>password:</span>
	    	<br>
	    	<input id="password" name="password" type="password">
	    </p>
	    <p><input type="submit" value="submit"></p>
    </form>
  </body>
</html>

logout.ejs 
<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1>Hello World</h1>
    <p>Welcome to <%= title %></p>
    <p>正在登出...</p>
    <script type="text/javascript">
    	setTimeout(function(){
    		window.location.href = "/";
    	}, 500);
    </script>
  </body>
</html>

homepage.ejs
 

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1>Hello World</h1>
    <p>Welcome to <%= title %></p>
    <p><a href="logout">登出</a></p>
  </body>
</html>

error.ejs 出錯頁面,我沒做,你有興趣可以自己試試玩玩。

3 在routes下的index.js配置路由,也就是請求對映處理

index.js

var express = require('express');
var router = express.Router();
var mongoose = require('mongoose');
var user = require('../models/user').user;
mongoose.connect('mongodb://localhost/hello-world');

/* GET home page. */
router.get('/', function(req, res) {
  	res.render('index', { title: 'index' });
});

/*login*/
router.get('/login', function(req, res) {
 	 res.render('login', { title: 'login' });
});

/*logout*/
router.get('/logout', function(req, res) {
  	res.render('logout', { title: 'logout' });
});

/*hompage*/
router.post('/homepage', function(req, res) {
	var query_doc = {userid: req.body.userid, password: req.body.password};
	(function(){
		user.count(query_doc, function(err, doc){
			if(doc == 1){
				console.log(query_doc.userid + ": login success in " + new Date());
				res.render('homepage', { title: 'homepage' });
			}else{
				console.log(query_doc.userid + ": login failed in " + new Date());
				res.redirect('/');
			}
		});
	})(query_doc);
});

module.exports = router;




ok,基本上大功告成,可以試試咯。

下面講講如何除錯伺服器端的程式碼:
我們最好藉助一個叫node-inspector的工具包
npm i -g node-inspector //安裝node-inspector
然後在cmd裡執行
node-inspector
再新開啟一個cmd,cd到專案hello-world目錄下
node --debug ./bin/www (或者 node --debug-brk ./bin/www , 舊版本express建立的node程式請使用 node --debug app.js)
在瀏覽器裡開啟http://127.0.0.1:8080/debug?port=5858
再新建視窗開啟http://127.0.0.1:3000/
就在瀏覽器可以除錯伺服器端程式碼。