之前的文章我們已經能夠在本地啟動一個簡單的專案，本章我們來看一下 koa 路由，get 傳值，動態路由。
一、Koa 路由
路由(Routing)是由一個 URI(或者叫路徑)和一個特定的 HTTP 方法(GET、POST 等)組成的，涉及到應用如何響應客戶端對某個網站節點的訪問。
通俗的講:路由就是根據不同的 URL 地址，載入不同的頁面實現不同的功能。
Koa 中的路由和 Express 有所不同，在 Express 中直接引入 Express 就可以配置路由，但是在 Koa 中我們需要安裝對應的 koa-router 路由模組來實現。
npm install koa-router --save
我們接著上一節的專案目錄來編寫，將我們的 app.js 檔案改為如下：
1 //引入 koa模組 2 var Koa = require('koa'); 3 var Router = require('koa-router'); 4 5 //例項化 6 var app = new Koa(); 7 var router = new Router(); 8 9 //配置路由 10 router.get('/', async (ctx) => { 11 // ctx 上下文 context ，包含了request 和response等資訊 12 // 返回資料 相當於：原生裡面的res.writeHead() res.end() 13 ctx.body = '首頁'; 14 }); 15 router.get('/news', async (ctx) => { 16 ctx.body = "新聞頁面"; 17 }); 18 19 //啟動路由 20 app.use(router.routes()); 21 app.use(router.allowedMethods()); 22 /** 23 router.allowedMethods()作用： 這是官方文件的推薦用法,我們可以 24 看到 router.allowedMethods()用在了路由匹配 router.routes()之後,所以在當所有 25 路由中介軟體最後呼叫.此時根據 ctx.status 設定 response 響應頭 26 可以配置也可以不配置,建議配置， 27 */ 28 29 app.listen(3000);
在上面的程式碼中我們引入了 koa-router 模組來配置我麼們的路由，具體操作如上，我們通過 router.get() 的方式定義了兩個路由地址 "/" 和 "/news"，在呼叫路由的頁面分別返回不同的內容 ，最終結果如下：
當我們在本地啟動專案後，在埠 3000 後輸入 "/"，表示的依舊是該頁面，當我們在埠後輸入 "/news" 時結果如下：
可以看出不同的路由能夠顯示不同的內容，說明我們的路由已經配置好了。
但是在實際應用中我們會看到瀏覽器的 url 地址是這樣的 http://localhost:3000/news?id=1&title=aaa
那我們在後臺改如何接收到 ? 後面的傳值呢，如下程式碼：
1 //引入 koa模組 2 var Koa = require('koa'); 3 var Router = require('koa-router'); 4 5 //例項化 6 var app = new Koa(); 7 var router = new Router(); 8 9 //配置路由 10 router.get('/', async (ctx) => { 11 // ctx 上下文 context ，包含了request 和response等資訊 12 // 返回資料 相當於：原生裡面的res.writeHead() res.end() 13 ctx.body = '首頁'; 14 }); 15 router.get('/news', async (ctx) => { 16 /** 17 在 koa2 中 GET 傳值通過 request 接收，但是接收的方法有兩種：query 和 querystring。 18 query：返回的是格式化好的引數物件。 19 querystring：返回的是請求字串。 20 */ 21 22 //從ctx中讀取get傳值 23 console.log(ctx.url); // /news?id=1&title=aaa 24 console.log(ctx.query); // { id: '1', title: 'aaa' } 獲取的是物件 用的最多的方式 ******推薦 25 console.log(ctx.querystring); // id=1&title=aaa 獲取的是一個字串 26 27 //ctx裡面的request裡面獲取get傳值 28 console.log(ctx.request.url); // /news?id=1&title=aaa 29 console.log(ctx.request.query); // { id: '1', title: 'aaa' } 物件 30 console.log(ctx.request.querystring); // id=1&title=aaa 31 ctx.body = "新聞頁面"; 32 }); 33 34 //啟動路由 35 app.use(router.routes()); 36 app.use(router.allowedMethods()); 37 /** 38 router.allowedMethods()作用： 這是官方文件的推薦用法,我們可以 39 看到 router.allowedMethods()用在了路由匹配 router.routes()之後,所以在當所有 40 路由中介軟體最後呼叫.此時根據 ctx.status 設定 response 響應頭 41 可以配置也可以不配置,建議配置， 42 */ 43 44 app.listen(3000);
我們在 router.get("/news", ) 的路由中可以通過 ctx. 來獲取我們想要的 get 傳值，ctx 列印出來會有很多內容，在這裡我們選了三個， url，query，querystring，另外在 ctx.request 中同樣包含這三個內容，輸出結果是一樣的。我們建議 get 傳值的方式是 ctx.query 的形式。我們來看一下結果：
我們在瀏覽器中輸入如上地址，然後回車，我們看一下編輯器的控制檯輸出日誌：
通過以上方法我們就能獲取到我們想要的 get 傳值資料了。
還有一種情況我們看到的並不是上面的情況，而是 http://localhost:3000/news/123
如果是上面的情況，我們需要在後臺這樣配置： router('/news/123', async () => {}) ，這樣顯然是可行的，但是如果 /news/ 後面跟的 123 可能是別的內容，那我們還需要再寫一個隨之對應的路由，這樣顯然是不可取的，這時候我們就需要引入動態路由了，如下：
1 //引入 koa模組 2 var Koa = require('koa'); 3 var Router = require('koa-router'); 4 5 //例項化 6 var app = new Koa(); 7 var router = new Router(); 8 9 //配置路由 10 router.get('/', async (ctx) => { 11 // ctx 上下文 context ，包含了request 和response等資訊 12 // 返回資料 相當於：原生裡面的res.writeHead() res.end() 13 ctx.body = '首頁'; 14 }); 15 router.get('/news/:id', async (ctx) => { 16 /** 17 獲取動態路由傳參 18 */ 19 20 //從ctx中讀取get傳值 21 console.log(ctx.url); // /news/123 22 console.log(ctx.params); // { id: '123' } 23 ctx.body = "新聞頁面"; 24 }); 25 26 //啟動路由 27 app.use(router.routes()); 28 app.use(router.allowedMethods()); 29 /** 30 router.allowedMethods()作用： 這是官方文件的推薦用法,我們可以 31 看到 router.allowedMethods()用在了路由匹配 router.routes()之後,所以在當所有 32 路由中介軟體最後呼叫.此時根據 ctx.status 設定 response 響應頭 33 可以配置也可以不配置,建議配置， 34 */ 35 36 app.listen(3000);
我們將之前的 router.get('/news', ) 改為 router.get('/news/:id', ) 的形式，然後通過 ctx.params 就能獲取到我們想要的 get 傳參，結果如下：
我們在瀏覽器中輸入如上地址，然後回車，我們看一下編輯器的控制檯輸出日誌：
通過以上方法我們就能獲取到我們想要的 get 傳值資料了。