跳到主要內容

[教學] express 路由與應用,express route setting in node.js

在前面有許多篇幅解說 node.JS 基本操作概念
Express ,這個套件主要幫忙解決許多Node.JS http server 所需要的基本服務,讓開發http service 變得更為容易,不需要像之前需要透過層層模組(module)才有辦法開始編寫自己的程式。
這個套件是由TJ Holowaychuk 製作而成的套件,裡面包含基本的路由處理(route),http 資料處理(GET/POST/PUT),另外還與樣板套件(js html template engine)搭配,同時也可以處理許多複雜化的問題。

Express 安裝

安裝方式十分簡單,只要透過之前介紹的 NPM 就可以使用簡單的指令安裝,指令如下,
npm install -g express
這邊建議需要將此套件安裝成為全域模組,方便日後使用。

Express 基本操作

express 的使用也十分簡單,先來建立一個基本的hello world ,
var app = require('express').createServer(),
    port = 1337; 

app.listen(port);

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

console.log('start express server\n');
可以從上面的程式碼發現,基本操作與node.js http 的建立方式沒有太大差異,主要差在當我們設定路由時,可以直接透過 app.get 方式設定回應與接受方式。

Express 路由處理

Express 對於 http 服務上有許多包裝,讓開發者使用及設定上更為方便,例如有幾個路由設定,那我們就統一藉由 app.get 來處理,
// ... Create http server

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

app.get('/test', function(req, res){                                                                                                                                       
    res.send('test render');
});

app.get('/user/', function(req, res){
    res.send('user page');
});
如上面的程式碼所表示,app.get 可以帶入兩個參數,第一個是路徑名稱設定,第二個為回應函式(call back function),回應函式裡面就如同之前的 createServer 方法,裡面包含 request, response 兩個物件可供使用。使用者就可以透過瀏覽器,輸入不同的url 切換到不同的頁面,顯示不同的結果。
路由設定上也有基本的配對方式,讓使用者從瀏覽器輸入的網址可以是一個變數,只要符合型態就可以有對應的頁面產出,例如,
// ... Create http server

app.get('/user/:id', function(req, res){                                                                                                                                   
    res.send('user: ' + req.params.id);
}); 

app.get('/:number', function(req, res){
    res.send('number: ' + req.params.number);
}); 
裡面使用到:number ,從網址輸入之後就可以直接使用 req.params.number 取得所輸入的資料,變成url 參數使用,當然前面也是可以加上路徑的設定, /user/:id,在瀏覽器上路徑必須符合 /user/xxx,透過 req.params.id 就可以取到 xxx這個字串值。
另外,express 參數處理也提供了路由參數配對處理,也可以透過正規表示法作為參數設定,
var app = require('express').createServer(),
    port = 1337; 

app.listen(port);

app.get(/^\/ip?(?:\/(\d{2,3})(?:\.(\d{2,3}))(?:\.(\d{2,3}))(?:\.(\d{2,3})))?/, function(req, res){                                                                                            
    res.send(req.params);
});
上面程式碼,可以發現後面路由設定的型態是正規表示法,裡面設定格式為 /ip 之後,必須要加上ip 型態才會符合資料格式,同時取得ip資料已經由正規表示法將資料做分群,因此可以取得ip的四個數字。
此程式執行之後,可以透過瀏覽器測試,輸入網址為 localhost:3000/ip/255.255.100.10,可以從頁面獲得資料,
[
    "255",
    "255",
    "100",
    "10"
]

完整程式碼


後記

Express 在node.js 當中是一個不可或缺的套件,協助開發者省下許多事情,當然在config也有許多設定,不過預設這篇文章是介紹給完全沒有接觸過express 的朋友,在這邊就不多贅述,如果有興趣深入的朋友,可以直接到express 文件,裡面有更多詳細的使用說明及介紹。
如果各位有什麼好的使用方式,或者是在開發時遇到任何問題,歡迎在底下留言,希望能聽到大家更多的回饋。如果資料上有任何錯誤的地方歡迎指正。

工商服務

Node.JS Taiwan 社群目前著手共筆的中文教學資料,歡迎有興趣者共同關注,相關網址資訊,

留言

這個網誌中的熱門文章

[分享] 腳踏車環島注意事項

很多人都期望自己能夠做點什麼,做些什麼,而退伍之後的第二個星期,就展開了環島之旅。 對很多人來說這不算什麼,甚至有人展開了走路、跑步、溜滑板、單輪車等方式環島一周,充分展現對台灣的愛與關懷。 這篇主要讓不知道怎麼準備環島的人,作一個完善的解說,首先隨身的東西要有: 證件現金類 : 身份證 健保卡 學生證 現金 提款卡 悠遊卡

館長的網站技術瓶頸,小弟弟來解答 - notorious-2019.com

館長的網站技術瓶頸,小弟弟來解答 - notorious-2019.com 昨天看到館長的網站倒了,也看到館長說一個月花費大概一百萬左右的月費在支持這個架設的電商網站,也對外發布出來訊息,希望求救, 直接講結論 建議解法, 1. 首先要做的事情是讓整個網站可以橫向擴展 (Load Balancer + n 台伺服器),對,相信我,IIS 也是可以做 Scale out, 這是對於 Application layer 服務的解法。 2. 資料的部分 SQL 吞吐量,建議改成 GCP Cloud SQL, 或者就直接轉到 Azure SQL Server 環境上會相對容易解決 SQL 的問題。 上述 2 個步驟都處理完,其實 100 萬的費用,應該 20000 concurrent user 是沒有問題的,但前提是要設定『對』! 額外需要花較長期時間要處理的,建議就是在 Queue 的處理,購物車的狀態都可以進入到 Queue 再來處理 SQL insert 的問題,減少不斷的 insert / update 的狀態,後文會提到 ... 底下詳細的會再說明如何後後續還有哪些處理的細節。 這兩天剛好有個小空擋,就來分析一下狀況, 可以從外部讀取得到的服務大致上如下, ASP.Net : 4.0 IIS 10 + Windows (廢話) SQL Server (推測) OP Service: PleskWin Host: Google Cloud DNS: Cloudflare 前端服務內容架構 Server-side render, jQuery base, 推測有可能採用現成購物車來進行,看起來不太像是用 wooCommerce 比較像是 Cart Functionality 這類的項目直接搭建而成(當然這純屬猜測) 功能拆解 因為網站是透過 Server site render 所有頁面都需要重新透過伺服器進行載入,這樣的狀況,如果在頻繁忙碌的 eCommerce 網站架構下會是一個致命傷, 簡單來說,數量的查詢,特惠價,優惠碼等等資訊的處理,使用者每做一步都需要重新跳轉頁面,或者整頁面重新讀取,只是為了部分的資料更新,這些都可以抽取出來成為 API ,透過 AJAX 的方式進行讀取。 讀寫分離 在不了解目前資料庫複雜狀態下,首先要讓所有人都

[教學] 快快樂樂刪除CodeIgniter index.php

預設的CI網址預設都設定為index.php同一層級,因此所有的程式都必須指定index.php導向才能開始,例如 http://localhost/ci/index.php/welcome/test http://localhost/ci/welcome/test 本文將說明如何將惱人的index.php消除,還你一個漂亮的URL。 設定開始: 接下來說明如何使用rewrite方式將惱人的index.php去除。 rewrite不清楚的人,煩請先自行google 首先要先確定Apache的 mod_rewrite 有 開啟 ,如果沒有開啟請設定好之後重新啟動apache。 接著,在根目錄底下建立一個新檔案,檔名為 .htaccess ,裡面程式碼如下: <IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^(.*)$ index.php/$1 [L] </IfModule> 接著到 application/config/config.php ,開啟檔案修改 $config['index_page'] = ""; 注意: /index.php/$1 要根據你目錄,例如 http://localhost/index.php ,網站根目錄為 /ci/index.php 則要寫成 /ci/index.php/$1 接著至CI目錄下,尋找 config\config.php , 修改一下裡面的檔案,修改如下: $config['index_page'] = ""; 存檔後,如此一來大功告成。 參考資料 官方網站說明