概述
最近學習利用koa搭建API接口，小有所得，現在記錄下來，供以后開發時參考，相信對其他人也有用。
就目前我所知道的而言，API有2種，一種是jsonp這種API，前端通過ajax來進行跨域請求獲得數據；另一種是restful API，前端通過fetch或者axios進行cors請求來獲得數據。
本篇博文記錄我用koa打造的jsonp API。
可以先查看我的上一篇文章：利用koa打造jsonp API。
參考資料：《Koa2進階學習筆記》，KOA docs
restful API
其實搭建restful API很簡單，引入cors中間件即可，不需要設置請求頭為Access-Control-Allow-Origin，這個中間件會自動幫我們設置。我們先引入中間件，然后重開一個路由存放restful API即可，代碼如下：
'use strict'
const Koa = require('koa');
const logger = require('koa-logger');
const Router = require('koa-router');
const cors = require('@koa/cors');
const app = new Koa();
app.use(logger());
app.use(cors());
// 子路由1：主頁
let routerHome = new Router();
routerHome.get('/', async (ctx) => {
ctx.body = '歡迎歡迎！';
})
// 子路由2：jsonp api
let routerJsonp = new Router();
routerJsonp.get('/data1', async (ctx) => {
let cb = ctx.request.query.callback;
ctx.type = 'text';
ctx.body = cb + '(' + '"數據"' + ')';
})
// 子路由3：restful api
let routerRest = new Router();
routerRest.get('/data1', async (ctx) => {
ctx.body = 'rest數據';
})
// 裝載所有路由
let router = new Router();
router.use('/', routerHome.routes(), routerHome.allowedMethods());
router.use('/jsonp', routerJsonp.routes(), routerJsonp.allowedMethods());
router.use('/restful', routerRest.routes(), routerRest.allowedMethods());
app.use(router.routes()).use(router.allowedMethods());
app.listen(3000, () => {
console.log('koa starts at port 3000!');
})
然后利用下面的請求代碼，就會在控制台輸出“rest數據”。
$.ajax({
url : 'http://localhost:3000/restful/data1',
type : 'get',
success : function(res){
console.log(res);
},
error: function() {
alert("網絡出現錯誤，請刷新！");
}
});
改進
不得不說，我們的api是非常簡陋的，我們考慮對它做如下改進：
- 支持post請求。這個很好辦，在路由那里添加post方法即可。
- 支持yaml數據導入，然后通過api，把數據作為resonse發送出去。這個需要2步操作，第一步用node導入並解析yaml數據為對象，第二步把對象轉化為字符串傳遞出去。第一步需要用到fs庫和yamljs庫，第二步需要用到JSON.stringify方法。具體代碼如下：
首先支持post請求：
'use strict'
const Koa = require('koa');
const logger = require('koa-logger');
const Router = require('koa-router');
const cors = require('@koa/cors');
const app = new Koa();
app.use(logger());
app.use(cors());
// 子路由1：主頁
let routerHome = new Router();
routerHome.get('/', async (ctx) => {
ctx.body = '歡迎歡迎！';
})
// 子路由2：jsonp api
let routerJsonp = new Router();
routerJsonp.get('/data1', async (ctx) => {
let cb = ctx.request.query.callback;
ctx.type = 'text';
ctx.body = cb + '(' + '"數據"' + ')';
}).post('/data1', async (ctx) => {
let cb = ctx.request.query.callback;
ctx.type = 'text';
ctx.body = cb + '(' + '"數據"' + ')';
})
// 子路由3：restful api
let routerRest = new Router();
routerRest.get('/data1', async (ctx) => {
ctx.body = 'rest數據';
}).post('/data1', async (ctx) => {
ctx.body = 'rest數據';
})
// 裝載所有路由
let router = new Router();
router.use('/', routerHome.routes(), routerHome.allowedMethods());
router.use('/jsonp', routerJsonp.routes(), routerJsonp.allowedMethods());
router.use('/restful', routerRest.routes(), routerRest.allowedMethods());
app.use(router.routes()).use(router.allowedMethods());
app.listen(3000, () => {
console.log('koa starts at port 3000!');
})
然后我們新建jsonp.data1.yaml文件作為jsonp API的原始數據，新建restful.data1.yaml作為restful API的原始數據。
//jsonp.data1.yaml
api: "jsonp"
info:
version: "0.0.1"
title: test for jsonp
//restful.data1.yaml
api: "restful"
info:
version: "0.0.1"
title: test for restful
然后我們添加fs庫(node自帶，不需要install)和yamljs庫進行導入和解析yaml文件，並且用JSON.stringify方法把json對象轉化為字符串：
'use strict'
const Koa = require('koa');
const logger = require('koa-logger');
const Router = require('koa-router');
const cors = require('@koa/cors');
const fs = require('fs');
const YAML = require('yamljs');
const app = new Koa();
app.use(logger());
app.use(cors());
// 子路由1：主頁
let routerHome = new Router();
routerHome.get('/', async (ctx) => {
ctx.body = '歡迎歡迎！';
})
// 子路由2：jsonp api
let routerJsonp = new Router();
routerJsonp.get('/data1', async (ctx) => {
let cb = ctx.request.query.callback;
ctx.type = 'text';
ctx.body = cb + '(' + JSON.stringify(YAML.parse(fs.readFileSync('./jsonp.data1.yaml').toString())) + ')';
}).post('/data1', async (ctx) => {
let cb = ctx.request.query.callback;
ctx.type = 'text';
ctx.body = cb + '(' + JSON.stringify(YAML.parse(fs.readFileSync('./jsonp.data1.yaml').toString())) + ')';
})
// 子路由3：restful api
let routerRest = new Router();
routerRest.get('/data1', async (ctx) => {
ctx.body = YAML.parse(fs.readFileSync('./restful.data1.yaml').toString());
}).post('/data1', async (ctx) => {
ctx.body = YAML.parse(fs.readFileSync('./restful.data1.yaml').toString());
})
// 裝載所有路由
let router = new Router();
router.use('/', routerHome.routes(), routerHome.allowedMethods());
router.use('/jsonp', routerJsonp.routes(), routerJsonp.allowedMethods());
router.use('/restful', routerRest.routes(), routerRest.allowedMethods());
app.use(router.routes()).use(router.allowedMethods());
app.listen(3000, () => {
console.log('koa starts at port 3000!');
})
用前面類似的方法進行請求，可以看到返回了如下數據，並且支持了post請求。
//jsonp接口
Object {api: "jsonp", info: Object}
//restful接口
Object {api: "restful", info: Object}
其它
到這里就全部完成了，我盡量一點一點地淺顯的寫出來。實際上還有更多可以優化的地方：
- 支持匹配各種模糊的url路徑。
- 支持對傳入參數進行處理。
- 支持https。
而且我們再一次看到，學習koa其實就是各種中間件和api的學習罷了。
最后寫一下需要install的庫：(雖然可以通過require推測出來)
"@koa/cors": "^2.2.1",
"koa": "^2.5.1",
"koa-bodyparser": "^4.2.0",
"koa-logger": "^3.2.0",
"koa-router": "^7.4.0",
"yamljs": "^0.3.0"
本文代碼存放在我的github的blog_server倉庫的demo文件夾里面。