重新認識Koa2

Node.js 是一個非同步的世界，官方 API 支援的都是 callback 形式的非同步程式設計模型，這 會帶來許多問題，例如:

callback
Koa

Koa – 基於 Node.js 平臺的下一代 web 開發框架

koa 是由 Express 原班人馬打造的，致力於成為一個更小、更富有表現力、更健壯的 Web 框架。 使用 koa 編寫 web 應用，可以免除重複繁瑣的回撥函式巢狀， 並極大地提 升錯誤處理的效率。 koa 不在核心方法中繫結任何中介軟體， 它僅僅提供了一個輕量優雅的 函式庫，使得編寫 Web 應用變得得心應手。開發思路和 express 差不多，最大的特點就是 可以避免非同步巢狀

1.2 Koa2.x 框架的安裝使用

1. 安裝 Node.js 8.x 以上的版本

開發 Koa2 之前， Node.js 是有要求的，它要求 Node.js 版本高於 V7.6 。因為 node.js 7.6 版本 開始完全支援 async/await ，所以才能完全你支援我們的 Koa2`

2. 安裝 Koa

安裝 Koa 框架和我們以前安裝其他模組是一樣的

npm install --save koa / cnpm install --save koa

--save 引數，表示自動修改 package.json 檔案，自動新增依賴項

簡單使用

二、koa 路由 get傳值、動態路由

2.1 Koa 路由

• 路由( Routing )是由一個 URI (或者叫路徑)和一個特定的 HTTP 方法( GET 、 POST 等)
  組成的，涉及到應用如何響應客戶端對某個網站節點的訪問
• 通俗的講:路由就是根據不同的 URL 地址，載入不同的頁面實現不同的功能
• Koa 中的路由和 Express 有所不同，在 Express 中直接引入 Express 就可以配置路由，但是在 Koa 中我們需要安裝對應的 koa-router 路由模組來實現

npm install --save koa-router

2.2 Koa 路由 get 傳值

在 koa2 中 GET 傳值通過 request 接收，但是接收的方法有兩種: query 和 querystring

query
querystring

2.3 Koa 動態路由

三、koa 中介軟體及執行流程

3.1 koa中介軟體的洋蔥圖執行流程

3.2 koa 中介軟體

3.2.1 什麼是 Koa 的中介軟體

• 通俗的講:中介軟體就是匹配路由之前或者匹配路由完成做的一系列的操作，我們就可以
  把它叫做中介軟體
• 在 express 中介軟體( Middleware )是一個函式，它可以訪問請求物件(request object (req)), 響應物件( response object (res) ), 和 web 應用中處理請求-響應迴圈流程中的中介軟體，一 般被命名為 next 的變數。在 Koa 中中介軟體和 express 有點類似。

中介軟體的功能包括

• 執行任何程式碼
• 修改請求和響應物件
• 終結請求-響應迴圈
• 呼叫堆疊中的下一個中介軟體

如果我的 get 、 post 回撥函式中，沒有 next 引數，那麼就匹配上第一個路由，就不會往下匹 配了。如果想往下匹配的話，那麼需要寫 next()

3.2.2 Koa 應用可使用如下幾種中介軟體

1. 應用級中介軟體

2. 路由中介軟體

3. 錯誤處理中介軟體

4. 第三方中介軟體

3.2.3 Koa 中介軟體的執行順序

Koa 的中介軟體和 Express 不同， Koa 選擇了洋蔥圈模型

四、koa ejs模板引擎使用 以及ejs配置全域性資料

1. 安裝 koa-views 和 ejs

koa-views npm install --save koa-views / cnpm install --save koa-views
ejs npm install ejs --save / cnpm install ejs --save

2. 引入 koa-views 配置中介軟體

const views = require('koa-views');

app.use(views('views', { map: {html: 'ejs' }}));

3. Koa 中使用 ejs

router.get('/add',async (ctx)=>{ 
let title = 'hello koa2' 

await ctx.render(index',{ title })
})

4. Ejs 引入模板

<%- include header.ejs %>

5. Ejs 繫結資料

<%=h%>

6. Ejs 繫結 html 資料

<%-h%>

7. Ejs 模板判斷語句

<% if(true){ %>
<div>true</div>
<%} else{ %>
<div>false</div>
<%} %>

8. Ejs 模板中迴圈資料

<%for(var i=0;i<list.length;i++) { %>
<li><%=list[i] %></li>
<%}%>

五、koa post 提交資料 koa-bodyparser 中介軟體的使用

5.1 原生 Nodejs 獲取 post 提交資料

function parsePostData(ctx){
return new Promise((resolve,reject)=>{
try{
let postdata="";
ctx.req.on('data',(data)=>{
postdata += data
})
ctx.req.on("end",function(){
resolve(postdata);
})
}catch(error){
reject(error);
}
}
});
}

5.2 Koa 中 koa-bodyparser 中介軟體的使用

1. 安裝 koa-bodyparser

npm install --save koa-bodyparser

2. 安裝 引入配置中介軟體

var Koa = require('koa');
var bodyParser = require('koa-bodyparser');

var app = new Koa();

app.use(bodyParser());
app.use(async ctx => {
ctx.body = ctx.request.body;
})

3. 使用

ctx.request.body // 獲取 post 提交的資料

六、koa-static靜態資源中介軟體

1. 安裝 koa-static

npm install --save koa-static

2. 引入配置中介軟體

const static = require('koa-static');

app.use(static(
path.join( __dirname, 'public')
))

七、koa art-template高效能模板引擎的使用

7.1 常見模板引擎的效能對比

適用於 koa 的模板引擎選擇非常多，比如 jade 、 ejs 、 nunjucks 、 art-template 等

• art-template 是一個簡約、超快的模板引擎
• 它採用作用域預宣告的技術來優化模板渲染速度，從而獲得接近 JavaScript 極限的執行 效能，並且同時支援 NodeJS 和瀏覽器。
• art-template 支援 ejs 的語法，也可以用自己的類似 angular 資料繫結的語法
• 中文文件: http://aui.github.io/art-template/zh-cn/docs

7.2 在 Koa 中使用 art-template 模板引擎

npm install --save art-template 
npm install --save koa-art-template

const Koa = require('koa');
const render = require('koa-art-template');

const app = new Koa();

render(app, {
root: path.join(__dirname, 'view'),
extname: '.art',
debug: process.env.NODE_ENV !== 'production'
});
app.use(async function (ctx) {
await ctx.render('user');
});
app.listen(8080);

7.3 art-template 模板引擎語法

參考: http://aui.github.io/art-template/zh-cn/docs/syntax.html

八、koa Cookie的使用

8.1 Koa Cookie 的使用

1. Koa 中設定 Cookie 的值

ctx.cookies.set(name, value, [options])

通過 options 設定 cookie name 的 value

2. Koa 中獲取 Cookie 的值

ctx.cookies.get('name');

8.2 Koa 中設定中文 Cookie

console.log(new Buffer('hello, world!').toString('base64'));// 轉換成 base64 字元 串:aGVsbG8sIHdvcmxkIQ==

console.log(new Buffer('aGVsbG8sIHdvcmxkIQ==', 'base64').toString());// 還原 base 64 字串:hello, world!

九、koa Session 的使用

9.1 Session 簡單介紹

session 是另一種記錄客戶狀態的機制，不同的是 Cookie 儲存在客戶端瀏覽器中，而 session 儲存在伺服器上

9.2 Session 的工作流程

當瀏覽器訪問伺服器併發送第一次請求時，伺服器端會建立一個 session 物件，生 成一個類似於 key , value 的鍵值對， 然後將 key(cookie) 返回到瀏覽器(客戶)端，瀏覽 器下次再訪問時，攜帶 key(cookie) ，找到對應的 session(value) 。 客戶的資訊都儲存 在 session 中

9.3 koa-session 的使用

1. 安裝 express-session

npm install koa-session --save

2. 引入 express-session

const session = require('koa-session');

3. 設定官方文件提供的中介軟體

app.keys = ['some secret hurr'];
const CONFIG = {
key: 'koa:sess', //cookie key (default is koa:sess)
maxAge: 86400000, // cookie 的過期時間 maxAge in ms (default is 1 days)
overwrite: true, //是否可以 overwrite (預設 default true)
httpOnly: true, //cookie 是否只有伺服器端可以訪問 httpOnly or not (default true)
signed: true, //簽名預設 true
rolling:false, //在每次請求時強行設定cookie，這將重置cookie過期時間(預設:false)
renew: false, //(boolean) renew session when session is nearly expired
}
app.use(session(CONFIG, app));

4. 使用

//設定值 
ctx.session.username = "張三";

// 獲取值 
ctx.session.username

9.4 Cookie 和 Session 區別

• cookie 資料存放在客戶的瀏覽器上， session 資料放在伺服器上
• cookie 不是很安全，別人可以分析存放在本地的 COOKIE 並進行 COOKIE 欺騙 考慮到安全應當使用 session
• session 會在一定時間內儲存在伺服器上。當訪問增多，會比較佔用你伺服器的效能 考慮到減輕伺服器效能方面，應當使用 COOKIE
• 單個 cookie 儲存的資料不能超過 4K ，很多瀏覽器都限制一個站點最多儲存 20 個 cookie

十、Koa 操作 Mongodb 資料庫

官方文件: http://mongodb.github.io/node-mongodb-native/

十一、Koa 應用生成器以及 Koa 路由模 塊化

11.1 koa 應用生成器

通過應用 koa 腳手架生成工具 可以快速建立一個基於 koa2 的應用的骨架

1. 全域性安裝

npm install koa-generator -g

2. 建立專案

koa koa_demo

3. 安裝依賴

cd koa_demo

npm install

4. 啟動專案

npm start