koa2 入坑（2）之中间件

中间件	作用
koa-bodyparser	解析post请求体
koa-router	koa 路由
koa-session	会话存储
koa-static	处理静态资源

• koa-bodyparser

express 中有造好的轮子：body-parse 处理post请求，而koa 也有 koa-bodyparser

npm install koa-bodyparser --save

使用

const bodyParser = require('koa-bodyparser');
app.use(bodyParser())

在代码中使用后，直接可以用ctx.request.body进行获取POST请求参数，中间件自动给我们作了解析

var Koa = require('koa');
var bodyParser = require('koa-bodyparser');
 
var app = new Koa();
app.use(bodyParser());
 
app.use(async ctx => {
  // the parsed body will store in ctx.request.body 
  // if nothing was parsed, body will be an empty object {} 
  ctx.body = ctx.request.body;
})

注意 默认打开网站是get方式的！！！具体例子可以引用上一篇文章的例子

---

• koa 原生路由实现

想实现原生路由，需要得到地址栏输入的路径，然后根据路径的不同进行跳转。

建立的文件和文件夹.png

const Koa = require('koa')
const fs = require('fs');
const app = new Koa();

function render(page) {
    return new Promise((resolve, reject) => {
       // ES5 是拼接字符串 var pageUrl = './page'+page; 
       // 下面是采用ES6 `` 通过$ 插值方式 更加直观
        let pageUrl = `./page/${page}`;
       // binary  二进制
        fs.readFile(pageUrl, 'binary', (err, data) => {
            if(err){
                reject(err);
            }else {
                resolve(data);
            }
        })
    })
}

async function route(url){
    let page = '404.html';
    switch (url){
        case '/':
            page = 'index.html';
            break;
        case '/index':
            page = 'index.html';
            break;
        case '/todo':
            page = 'todo.html';
            break;
        case '/404':
            page = '404.html';
            break;
        default:
            break;
    }
    let html = await render(page);

    return html;
}

app.use(async (ctx) => {
    let url = ctx.request.url;
    let html  = await route(url);

    ctx.body = html;

})
app.listen(3000, () => {
    console.log('http://127.0.0.1:3000');
});

• 获取url
• route 根据url 渲染不同的路由文件
  渲染即读取html文件需要时间 所以加入了async await

• koa-router
  express 中有 Router() 方法对路由进行解析 ， koa 也有 koa-router

npm install koa-router --save

const Koa = require('koa');
const Router = require('koa-router');

const app = new Koa();
const router = new Router();

app
    .use(router.routes())
    .use(router.allowedMethods());

router
    .get('/', function (ctx, next) {
        ctx.body = 'gershon you are the best';
    })
    .get('/todo', function (ctx, next) {
         ctx.body = 'todo page';
    });

app.listen(3000, () => {
    console.log('http://127.0.0.1:3000');
});

allowedMethods，顾名思义：就是当前接口运行的method。 比如，一个提供数据的接口，就可以设置为GET， 当客户端发送POST请求时，就会直接返回失败。

设置前缀

const router = new Router({
      prefix:'/gershon'
})

层级.png

路由层级

const Koa = require('koa');
const Router = require('koa-router');

const app = new Koa();
let home = new Router();
let page = new Router();

// home 路由
home.get('/gershon', async (ctx) => {
    ctx.body = 'HOME gershon page';
}).get('/todo', async (ctx) => {
    ctx.body = 'HOME todo page';
});

// page 路由
page.get('/gershon', async (ctx) => {
    ctx.body = 'PAGE gershon page';
}).get('/todo', async (ctx) => {
    ctx.body = 'PAGE todo page';
});

// 父级路由
let router = new Router();
router.use('/home', home.routes(), home.allowedMethods())
    .use('/page', page.routes(), page.allowedMethods())

// 加载路由中间件
app
    .use(router.routes())
    .use(router.allowedMethods());


app.listen(3000, () => {
    console.log('http://127.0.0.1:3000');
});

image.png

---

• cookie

• ctx.cookies.get(name,[optins]):读取上下文请求中的cookie。
• ctx.cookies.set(name,value,[options])：在上下文中写入cookie。

const Koa  = require('koa');
const app = new Koa();

app.use(async(ctx)=>{
    if(ctx.url=== '/index'){
        ctx.cookies.set(
            'MyName','gershon',{
                domain:'127.0.0.1', // 写cookie所在的域名
                path:'/index',       // 写cookie所在的路径
                maxAge:1000*60*60*24,   // cookie有效时长
                expires:new Date('2018-12-31'), // cookie失效时间
                httpOnly:false,  // 是否只用于http请求中获取
                overwrite:false  // 是否允许重写
            }
        );
        ctx.body = 'cookie is ok';
    }else{
        if( ctx.cookies.get('MyName')){
            ctx.body = ctx.cookies.get('MyName');
        }else{
            ctx.body = 'Cookie is none';
        }
    }
});

app.listen(3000,()=>{
    console.log('[demo] server is starting at port 3000');
})

• koa-session

当浏览器访问服务器并发送第一次请求时，服务器端会创建一个session对象，生成一个类似于key,value的键值对， 然后将key(cookie)返回到浏览器(客户)端，浏览器下次再访问时，携带key(cookie)，找到对应的session(value)。 客户的信息都保存在session中

npm install koa-session --save

const session = require('koa-session');
//设置值 ctx.session.username = "张三";
// 获取值 ctx.session.username

• koa-static

npm install --save koa-static

const Koa = require('koa')
const path = require('path')
const static = require('koa-static')

const app = new Koa()

const staticPath = './static'

app.use(static(
  path.join( __dirname,  staticPath)
))

app.use( async ( ctx ) => {
  ctx.body = 'hello world'
})

app.listen(3000, () => {
  console.log('[demo] static-use-middleware is starting at port 3000')
})

---

koa 中文网