摘要:概述中提出了新的路由。創(chuàng)建我們在中指定了屬性值為,因此會使用作為應(yīng)用的入口文件。創(chuàng)建路由中間件路由中間件實際是一種允許一個請求被處理之前進行某些操作的機制。一個請求到來時,它們會按照代碼中的先后順序依次執(zhí)行。
概述
ExpressJS 4.0中提出了新的路由Router。Router好比是一個“迷你版”的express應(yīng)用,它沒有引入views或者settings,但是提供了路由應(yīng)有的API,.use,.get,.param和route。
示例應(yīng)用讓我們創(chuàng)建一個express應(yīng)用,僅僅有少量routes和功能:
基礎(chǔ)路由:Home,About
一個把request請求打印到console的路由中間件
一個帶參數(shù)的路由
一個校驗特殊參數(shù)的路由中間件
一個用于登錄的路由,響應(yīng)對與路徑/login的GET和POST請求
校驗功能:校驗傳遞給某一個路由的參數(shù)
應(yīng)用文件架構(gòu)我們只需要兩個文件:
- package.json // 構(gòu)建node應(yīng)用所需要的插件 - server.js // 構(gòu)建示例應(yīng)用的啟動文件
我們會把路由代碼寫如server.js文件。將來為了讓示例應(yīng)用模塊化,我們會把這些路由代碼分別寫入不同的文件,甚至可以為網(wǎng)站的不同組成部分多帶帶定義不同的路由文件。
創(chuàng)建Node應(yīng)用創(chuàng)建node應(yīng)用,我們需要編寫package.json文件去定義node應(yīng)用依賴的插件。
{ "name": "express-router-experiments", "main": "server.js", "dependencies": { "express": "~4.0.0" } }
下面繼續(xù)安裝依賴:
$ npm install
現(xiàn)在我們安裝了Express,讓我們繼續(xù)編寫server.js去處理路由。
創(chuàng)建server我們在package.json中指定了main屬性值為server.js,因此Express會使用server.js作為應(yīng)用的入口文件。
// server.js // 基礎(chǔ)設(shè)置 // ============================================== var express = require("express"); var app = express(); var port = process.env.PORT || 8080; // 路由 // ============================================== // 示例路由 app.get("/sample", function(req, res) { res.send("this is a sample!"); }); // 我們會在這里編寫自己的路由 // 啟動server // ============================================== app.listen(port); console.log("Magic happens on port " + port);
現(xiàn)在我們可以使用命令node server.js啟動server。我們使用app.get創(chuàng)建了一個Express 3時代的路由,如果此時打開瀏覽器訪問http://localhost:8080/sample,我們就能看到這樣下面的文字:this is a sample!。
基本用法 express.Router()下面我們一起編寫Node應(yīng)用前端路由的例子,包括Home頁面和About頁面。
// server.js ... // 獲取router實例 var router = express.Router(); // home頁面路由(http://localhost:8080) router.get("/", function(req, res) { res.send("im the home page!"); }); // about頁面路由(http://localhost:8080/about) router.get("/about", function(req, res) { res.send("im the about page!"); }); // 把定義好的路由集成到Node應(yīng)用中 app.use("/", router); ...
我們前面的代碼使用express.Router()生成一個路由實例,并定義路由規(guī)則,最后把這個路由實例集成到應(yīng)用中。現(xiàn)在我們可以通過http://localhost:8080訪問Home頁面,通過http://localhost:8080/about訪問about頁面。
請注意:我們可以改變前面定義的路由中默認的根路徑("/")。如果我們把app.use("/", router)改為app.use("/app", router),那么home頁面的訪問地址變?yōu)?b>http://localhost:8080/app,about頁面的訪問地址變?yōu)?b>http://localhost:8080/app/about。
這是一個非常有用的功能,我們可以利用它創(chuàng)建多個路由實例express.Router()并把這些實例都集成到Node應(yīng)用中。例如,可以在Node應(yīng)用中針對不同功能需求創(chuàng)建不同的路由:一個基礎(chǔ)路由,一個用于權(quán)限校驗的路由和其他API路由。如此一來,Node應(yīng)用變得更加模塊化更容易擴展。
創(chuàng)建路由中間件Router.use()路由中間件實際是一種允許一個request請求被處理之前進行某些操作的機制。例如,在把一個request請求的響應(yīng)數(shù)據(jù)返回給用戶之前,我們可以檢查用戶是否有權(quán)限,可以記錄日志等等。
下面我們實現(xiàn)一個打印日志的中間件,每次有一個request請求,我們就在console打印一條信息。
// server.js ... // 獲取router實例 var router = express.Router(); // 路由中間件:每當有一個request請求都會執(zhí)行 router.use(function(req, res, next) { // 打印request的method和url console.log(req.method, req.url); // 繼續(xù)處理request請求,尋找匹配的路由 next(); }); // home頁面路由 (http://localhost:8080) router.get("/", function(req, res) { res.send("im the home page!"); }); // about頁面路由 (http://localhost:8080/about) router.get("/about", function(req, res) { res.send("im the about page!"); }); // 把定義好的路由集成到Node應(yīng)用中 app.use("/app", router); ...
我們用router.use()用來定義了路由中間件,并且把它應(yīng)用到所有訪問我們Node應(yīng)用的請求上。打開瀏覽器訪問http://localhost:8080/app,我們可以看到console打印的信息:im the home page!。
在代碼中,中間件和路由的位置順序非常重要。一個request請求到來時,它們會按照代碼中的先后順序依次執(zhí)行。這就意味著如果你把中間件寫在某一個路由的后面,路由會攔截這個request請求并完成響應(yīng),中間件則永遠不會被執(zhí)行。
帶參數(shù)的路由 /hello/:name我們想要在URL中傳遞一個人的名字name,讓NODE應(yīng)用輸出 Hello name! 這里可以使用帶參數(shù)的路由。
// server.js ... // 獲取router實例 var router = express.Router(); ... // 帶參數(shù)的路由 (http://localhost:8080/hello/:name) router.get("/hello/:name", function(req, res) { res.send("hello " + req.params.name + "!"); }); // 把定義好的路由集成到Node應(yīng)用中 app.use("/", router); ...
現(xiàn)在我們訪問http://localhost:8080/hello/holly就可以看到瀏覽器頁面展示的信息:
Hello holly!創(chuàng)建參數(shù)中間件
如果想要校驗上面?zhèn)魅險RL的人的名字,確保名字是符合規(guī)范的,我們需要在路由中間件中去校驗URL中的參數(shù)name。它有個特殊的名字,參數(shù)中間件。我們可以使用express.param()去創(chuàng)建它。
// server.js ... // 獲取router實例 var router = express.Router(); ... // 參數(shù)中間件 校驗name參數(shù) router.param("name", function(req, res, next, name) { // 在這里進行校驗操作 console.log("doing name validations on " + name); // 校驗通過我們把校驗后的名字賦值給req對象 req.name = name; // 繼續(xù)處理request請求,尋找匹配的路由 next(); }); // 帶參數(shù)的路由 (http://localhost:8080/hello/:name) router.get("/hello/:name", function(req, res) { res.send("hello " + req.name + "!"); }); // 把定義好的路由集成到Node應(yīng)用中 app.use("/", router);
現(xiàn)在當我們訪問到/hello/:name路由,我們編寫的參數(shù)中間件就會介入并做相應(yīng)的校驗處理。校驗通過我們把校驗后的名字賦值給req對象,并在相應(yīng)的.get路由中使用req.name獲取校驗后的名字。打開瀏覽器,訪問http://localhost:8080/hello/sally,我們可以看到瀏覽器展示的信息:
Hello sally!
console控制臺打印出:
doing name validations on sally
如果你使用RESTful API,你甚至可以校驗token是否有效,來判斷用戶是否有權(quán)限訪問。
鏈式路由我們也可以直接在app對象上創(chuàng)建路由。利用app.route()可以針對一個路由定義多個路由處理函數(shù)。例如,對/login路由發(fā)起get請求,展示登錄界面,同時也可以對/login路由發(fā)起post請求,提交登錄表單信息。我們就可以使用app.route來創(chuàng)建這個/login路由。
// ROUTES // ============================================== app.route("/login") // 展示登錄界面 (GET http://localhost:8080/login) .get(function(req, res) { res.send("this is the login form"); }) // 提交登錄表單 (POST http://localhost:8080/login) .post(function(req, res) { console.log("processing"); res.send("processing the login form!"); }); ...總結(jié)
使用Express 4.0中的路由,我們可以更靈活的定義路由:
多次使用express.Router()定義一組路由
使用express.Router()劃分模塊,并用app.use()把他們整合起來
使用路由中間件對request請求進行預(yù)處理
使用參數(shù)中間.param()件對URL中參數(shù)進行校驗
使用app.route()創(chuàng)建鏈式路由
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/99021.html
摘要:學(xué)習(xí)的源代碼的好處自然不少。閱讀源代碼可以幫你實現(xiàn)你的好奇心。本文會推薦一些的源代碼分析文章,可以幫助更快的,更加全方位的理解研讀之。 盡管有Hapi,Koa等有力的競爭者,express.js依然是非常流行的nodejs web服務(wù)器框架,畢竟它早于2007年就已經(jīng)在開發(fā)了。 學(xué)習(xí)expressjs的源代碼的好處自然不少。 它可以幫你深刻理解HTTP協(xié)議,這個協(xié)議是做前端后端都必然需...
摘要:發(fā)布是由團隊開源的,操作接口庫,已成為事實上的瀏覽器操作標準。本周正式發(fā)布,為我們帶來了,,支持自定義頭部與腳部,支持增強,兼容原生協(xié)議等特性變化。新特性介紹日前發(fā)布了大版本更新,引入了一系列的新特性與提升,本文即是對這些變化進行深入解讀。 showImg(https://segmentfault.com/img/remote/1460000012940044); 前端每周清單專注前端...
閱讀 2873·2021-08-20 09:37
閱讀 1613·2019-08-30 12:47
閱讀 1096·2019-08-29 13:27
閱讀 1691·2019-08-28 18:02
閱讀 754·2019-08-23 18:15
閱讀 3090·2019-08-23 16:51
閱讀 936·2019-08-23 14:13
閱讀 2140·2019-08-23 13:05