什麼是路由
路由這個次不是nodejs專屬,在web應用程式中就有路由,路由描述應用程式是否以及如何對調http(超文本傳輸協定)請求進行應答,當使用者在與應用程式或者網站互動的時候,浏覽器就會生成這些請求。
路由隻是個用來定義應用程式中http請求的最終點的術語,是以如果希望應用程式能夠做點什麼,那麼就必須使用路由了。
Express中的路由
在Express使用HTTP動詞來定義路由,HTTP動詞描述對服務的請求類型,最為可能用到的動詞Get,Post。
1. GET–從伺服器擷取資料
2. POST–将資料發送給伺服器
其他的也有一些如:PUT,Delete,HEAD,OPTION,TRACE。
node.js路由的從無到有
沒有路由
我們先建立一個沒有使用路由的應用程式吧。如我們上一片部落格Express的安裝和使用,我們建立express_routing檔案夾,在檔案夾内Shift+滑鼠右鍵,選擇在此處打開指令視窗,然後輸入:
express express_routing
cd express_routing && npm install
上邊的指令就是建立Express項目,并引入一些相應的子產品。
打開app.js,在倒數第二行假如app.listen(3000);加入端口号。
在指令視窗繼續輸入:
node app.js
然後再浏覽器輸入http://127.0.0.1:3000,然後觀察頁面

可是如果我們輸入的位址是http://127.0.0.1:3000/about的話,會出現404的錯誤,這就是about沒有路由可以使用,那麼我們改如何使用呢。
有路由
其實我們平時在做web項目的時候一直再用路由,隻是可能我們不知道那就叫路由,如我們常用的從伺服器擷取資料的GET請求,給伺服器資料POST。接下來我們分别介紹一下
添加GET路由
為了使用GET路由,我們需要Get HTTP請求,在上邊的沒有路由的例子中,打開app.js在
var app = express()
下邊加上下邊的代碼
app.get('/about',function(req,res){
res.send('孟海濱是個大帥哥');
});
運作改js,
node app.js
,在浏覽器輸入http://127.0.0.1:3000/about,這樣我們的這個程式就寫完了。看看效果如何。
添加POST路由
我們說完了添加GET路由,那麼接下來我們說一下POST路由,添加POST路由和添加GET路由是一樣的,隻是把動詞換做了post,如下:
app.post('/',function(req,res){
res.send(req.body);
});
在這個示例中,應用程式接收post請求,送到index頁面,并将資料輸送到浏覽器中。
建立一個檔案夾express_post,在該檔案夾下打開控制指令視窗。輸入:
express express_post
cd epxress_post && npm install
在app.js中添加
app.listen(3000);
在生成的程式中,打開view–>index.jade,添加如下代碼
h2 Form example
form(mehtod='post',action='/')
fieldset
legend Add a user
p
label First name
input(name='user[first_name]')
p
label Last name
input(name='user[last_name]')
p
input(type='submit',value='Save')
在浏覽器輸入http://127.0.0.1:3000,我們會看到浏覽器出現了這個界面
然後我們輸入一些資訊,就會在位址欄出現我們輸入的資訊了。
使用路由傳送參數
在web項目中,我們通常使用路由來傳遞參數,并且根據參數做相應的回應。例如下邊的url
user/123
department/456
第一個url是使用者ID位123的資訊顯示,第二個是部門id是456的資訊顯示。而且nodejs同樣也支援這種方式。
1.建立Express站點
express express_param
cd epxress_param && npm install
2.在app.js中添加如下代碼
app.get('/users/:id', function(req, res){
res.send('使用者ID是' + req.params.id);
});
app.listen();
3.啟動項目
4.在浏覽器輸入:http://127.0.0.1:3000/users/123,檢視結果。
注意:你可能發現了,我每次都是把路由放入到了app.js,如果我們的頁面需要大量的資料傳輸,可能使我們的程式特别複雜,難以維護,是以我們需要用一個類似于web項目的js檔案來專門寫這些東西,而這個Nodejs已經為我們考慮好,那就是我們的route檔案夾下的index.js檔案,我們可以直接寫在這裡邊,在我們的app.js中寫上
app.get('/',routes.index);
就可以了
使用本地變量
在res.render函數中,本地變量的使用要掌握關鍵所在,設定要在視圖層展示的資料。
将資料傳遞到視圖層。
我們可能對資料要進行一些處理。例如拼接字元串,計算等。無論做什麼,都需要在展示之前處理好。
app.js中添加如下代碼
app.get('/', function(req, res){
var user = {
first_name: 'Keyser',
surname: 'Soze',
address: 'Next door',
facebook_friends: '4'
};
res.render('index.jade', { title: 'User', user: user });
});
index.jade中添加如下代碼:
h3 First Name
p= user.first_name
h3 Surname
p= user.surname
h3 Address
p= user.address
h3 Facebook Friends
p= user.facebook_friends
執行node app.js,我們會看到如下結果
小結
我們接着在上一篇的Express的基礎上來講了在node.js中擷取和傳輸資料,使用參數等的方法,其實無非就是一個GET,POST,參數的使用。那麼Express到底是幹什麼的呢。
Express 是一個基于 Node.js 平台的極簡、靈活的 web 應用開發架構,它提供一系列強大的特性,幫助你建立各種 Web 和移動裝置應用。 說白了,一個快速為我們建立web前段的架構。