koa2入門使用總結

fozero發表於2018-12-24

koa2的介紹

Koa 是一個新的 web 框架，由 Express 幕後的原班人馬打造， 致力於成為 web 應用和 API 開發領域中的一個更小、更富有表現力、更健壯的基石。 通過利用 async 函式，Koa 幫你丟棄回撥函式，並有力地增強錯誤處理。 Koa 並沒有捆綁任何中介軟體， 而是提供了一套優雅的方法，幫助您快速而愉快地編寫服務端應用程式。

koa2安裝

npm install koa

koa middleware

每收到一個http請求，koa就會呼叫通過app.use()註冊的async函式，並傳入ctx和next引數
middleware的順序很重要，也就是呼叫app.use()的順序決定了middleware的順序

對於await next()，如果一個middleware沒有呼叫，則後續的middleware將不再執行了，使用場景
如，一個檢測使用者許可權的middleware可以決定是否繼續處理請求，還是直接返回403錯誤

app.use(async (ctx, next) => {
    if (await checkUserPermission(ctx)) {
        await next();
    } else {
        ctx.response.status = 403;
    }
});

ctx簡寫

ctx.url相當於ctx.request.url，ctx.type相當於ctx.response.type

url處理 ，使用koa-router

安裝koa-router

npm install koa-router
// 注意require('koa-router')返回的是函式:
const router = require('koa-router')();

這裡匯入koa-router的語句最後的()是函式呼叫
const router = require('koa-router')();
相當於 
const fn_router = require('koa-router');
const router = fn_router();


// add url-route:
router.get('/hello/:name', async (ctx, next) => {
    var name = ctx.params.name;
    ctx.response.body = `<h1>Hello, ${name}!</h1>`;
});

router.get('/', async (ctx, next) => {
    ctx.response.body = '<h1>Index</h1>';
});

// add router middleware:
app.use(router.routes());

這樣我們在訪問http://localhost:3000/hello/kerry時會列印hello，kerry

處理post請求

post請求通常會傳送一個表單，或者JSON，它作為request的body傳送，但無論是Node.js提供的原始request物件，還是koa提供的request物件，都不提供解析request的body的功能，所以我們需要用到koa-bodyparser中介軟體來解析request的body

安裝koa-bodyparser

npm install koa-bodyparser
const bodyParser = require('koa-bodyparser');

// 解決body 需在router之前註冊到app物件上
app.use(bodyParser());


這樣我們就可以處理post請求了
router.get('/', async (ctx, next) => {
    ctx.response.body = `<h1>Index</h1>
        <form action="/signin" method="post">
            <p>Name: <input name="name" value="koa"></p>
            <p>Password: <input name="password" type="password"></p>
            <p><input type="submit" value="Submit"></p>
        </form>`;
});

router.post('/signin', async (ctx, next) => {
    var
        name = ctx.request.body.name || '',
        password = ctx.request.body.password || '';
    console.log(`signin with name: ${name}, password: ${password}`);
    if (name === 'koa' && password === '12345') {
        ctx.response.body = `<h1>Welcome, ${name}!</h1>`;
    } else {
        ctx.response.body = `<h1>Login failed!</h1>
        <p><a href="/">Try again</a></p>`;
    }
});

程式碼優化

所有的程式碼都放在了app.js中
我們可以單獨將所有路由放到一個js檔案中，如果是複雜系統，還可以按模組建立多個路由檔案，如
user.js(處理使用者管理相關url)、login.js（處理使用者登入相關url）

靜態資源

安裝koa-static

npm install koa-static
const static = require('koa-static')
const path = require('path')

// 靜態資源目錄
app.use(static(
  path.join( __dirname,'./static')
));

我們在根目錄下建立static資料夾，新建一個json檔案，輸入如下地址訪問

http://localhost:3000/china.geojson

art-template模板引擎

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


// 模板引擎
const render = require('koa-art-template');

render(app, {
  root: path.join(__dirname, './static'),
  extname: '.html',
  // debug: process.env.NODE_ENV !== 'production'
});

// 使用ctx.render渲染頁面 可傳遞資料
router.get('/user', async (ctx, next) => {
    ctx.render('user',{
            data:'hello msg'
    });
});

html中渲染資料 {{data}}

更多用法檢視
https://aui.github.io/art-template/zh-cn/docs/index.html

koa2 跨域請求設定

https://github.com/zadzbw/koa2-cors
npm install --save koa2-cors

var cors = require('koa2-cors');
app.use(cors());

開發部署 ，使用nodemon在本地開發環境下自動重啟專案

1、 專案搭建好後，通過node執行

node app.js

也可以在package.json中新增scripts

"scripts": {
    "start": "node app.js"
}

這樣就可以執行

npm run start

然後訪問http://localhost:3000

2、 通過nodemon來執行專案

npm install -g nodemon

之後用 nodemon 來代替 node 來啟動應用

nodemon app.js

3、 如果是線上上 我們則使用pm2來管理應用程式，
pm2 是一個帶有負載均衡功能的Node應用的程式管理器.當你要把你的獨立程式碼利用全部的伺服器上的所有CPU，並保證程式永遠都活著，0秒的過載， PM2是完美的
https://www.cnblogs.com/lxg0/p/7771229.html

最後

通過以上簡單介紹對koa2使用，我搭建了一個koa2本地靜態node伺服器，已上傳至github，歡迎大家star或clone
koa2-server

相關文章