Express 中設定路由目錄

什麼是路由 （What is Rotuing ) ?

當瀏覽器發出請求時，應用程式如何回應。When you browser have ‘ Requset ‘ ,
How to respone with your App 瀏覽器發出的請求會包括一個網址和特定 HTTP 方法（如 GET，POST等）

app.get('/', (req, res) => {
res.send(this is my first express Web design )
})

/ get 的引數是 （ 路由根目錄 , 函氏（請求和回憶）

路由到Server 端的另一個目錄首頁面

lacalhot:3000 / home ,

路由到服務頁面的行銷服務 ～ /service/marketing'

測試 『 路由指定目錄 』

輸入網址在你的瀏覽器

!

https://ithelp.ithome.com.tw/upload/images/20200907/20123173jxvaXUlpcb.png

各位同學們..你們都學會了嗎！！！

靜態路由 和 動態路由

( Statice Route and Dynamic Route )

靜態路由 （static Route ) :
//--------------------------靜態路由---------------------
app.get('/home', (req, res) => {
res.send(<h1> this is my Home Page <h1> )
})
// routing 路有到home page 首頁
app.get('/service/marketing', (req, res) => {
res.send(<h1>this is service of Marketing )
})
// 路由到服務頁面的行銷服務 ～ /service/marketing'

動態路由 (Dynamic Route ) :

設定可變動參數Params
/----------------------動態路由 -----------------------------
app.get("/service/marketing/:active", (req, res) => {
res.send('active is a popular ')
})
// stp 1. 取出使用者請求當中的 active 值設定為 ~/:active
// stp 2. ~/:active 為可變動參數 Params
// 最終讓使用者可以在瀏覽器畫面上看到自己於網址列所輸入的內容。
取得動態路由中 params 的內容

將想要回應的內容回傳到瀏覽器.
透過respone ( res.send ) 回應的內容為 params 的內容, 並呈現於瀏覽器

app.get("/service/marketing/:active", (req, res) => {
res.send(<h1>${req.params.active} is Cool </h1>)
// stp 1. 取出使用者請求當中的 active 值
// stp 2 . 在 res. send 上 ${req.params.active } 表示參數.active 是可以變動
})

然後透過在網址上更動路由路徑同時呈現給瀏覽器, .這個應用非常廣泛, 後續再談.