一、Koa 路由

路由(Routing)是由一个 URI(或者叫路径)和一个特定的 HTTP 方法(GET、POST 等) 组成的，涉及到应用如何响应客户端对某个网站节点的访问。

通俗的讲:路由就是根据不同的 URL 地址，加载不同的页面实现不同的功能。

Koa 中的路由和 Express 有所不同，在 Express 中直接引入 Express 就可以配置路由，但是在 Koa 中我们需要安装对应的 koa-router 路由模块来实现。

npm install --save koa-router

/** https://www.npmjs.com/package/koa-router 1.安装模块 2.看文档使用 *///引入 koa模块var Koa=require('koa');var router = require('koa-router')();  /*引入是实例化路由** 推荐*///实例化var app=new Koa();router.get('/',async (ctx)=>{    ctx.body="首页";})router.get('/news',async (ctx)=>{    ctx.body="新闻列表页面";})router.get('/newscontent',async (ctx)=>{    ctx.body="新闻详情";})app.use(router.routes());   /*启动路由*/app.use(router.allowedMethods());/**  router.allowedMethods()作用： 这是官方文档的推荐用法,我们可以 看到 router.allowedMethods()用在了路由匹配 router.routes()之后,所以在当所有 路由中间件最后调用.此时根据 ctx.status 设置 response 响应头*/app.listen(3002);

二、GET请求数据获取

如果依靠ctx.request.url去手动处理路由，将会写很多处理代码，这时候就需要对应的路由的中间件对路由进行控制，这里介绍一个比较好用的路由中间件koa-router

安装koa-router中间件

# koa2 对应的版本是 7.xnpm install --save koa-router@7

快速使用koa-router

在 koa2 中 GET 传值通过 request 接收，但是接收的方法有两种:query 和 querystring。

query:返回的是格式化好的参数对象。

querystring:返回的是请求字符串。

在koa中，获取GET请求数据源头是koa中request对象中的query方法或querystring方法，query返回是格式化好的参数对象，querystring返回的是请求字符串，由于ctx对request的API有直接引用的方式，所以获取GET请求数据有两个途径。

一种是从上下文中直接获取请求对象ctx.query，返回如 { a:1, b:2 } 请求字符串 ctx.querystring，返回如 a=1&b=2

一种是从上下文的request对象中获取请求对象ctx.request.query，返回如 { a:1, b:2 } 请求字符串 ctx.request.querystring，返回如 a=1&b=2

/** https://www.npmjs.com/package/koa-router 1.安装模块 2.看文档使用 *///引入 koa模块var Koa=require('koa');var router = require('koa-router')();  /*引入是实例化路由** 推荐*///实例化var app=new Koa();router.get('/',async (ctx)=>{    ctx.body="首页";})router.get('/news',async (ctx)=>{    ctx.body="新闻列表页面";})//获取get传值//http://localhost:3002/newscontent?aid=123router.get('/newscontent',async (ctx)=>{    /*在 koa2 中 GET 传值通过 request 接收，但是接收的方法有两种：query 和 querystring。     query：返回的是格式化好的参数对象。     querystring：返回的是请求字符串。*/    //从ctx中读取get传值    console.log(ctx.query);  //{ aid: '123' }       获取的是对象   用的最多的方式      ******推荐    console.log(ctx.querystring);  //aid=123&name=zhangsan      获取的是一个字符串    console.log(ctx.url);   //获取url地址    //ctx里面的request里面获取get传值    console.log(ctx.request.url);    console.log(ctx.request.query);   //{ aid: '123', name: 'zhangsan' }  对象    console.log(ctx.request.querystring);   //aid=123&name=zhangsan    onst router = new Router(); router.get('/', function (ctx, next) {    ctx.body="Hello koa";})//从 request 中获取 GET 请求    let request =ctx.request;    let req_query = request.query;    let req_querystring = request.querystring; //从上下文中直接获取    let ctx_query = ctx.query;    let ctx_querystring =ctx.querystring;     ctx.body={           url,           req_query,           req_querystring,           ctx_query,           ctx_querystring    }    //ctx.body="新闻详情";})app.use(router.routes());   /*启动路由*/app.use(router.allowedMethods());/**  router.allowedMethods()作用： 这是官方文档的推荐用法,我们可以 看到 router.allowedMethods()用在了路由匹配 router.routes()之后,所以在当所有 路由中间件最后调用.此时根据 ctx.status 设置 response 响应头*/app.listen(3002);

执行程序

node get.js

执行后程序后，用chrome访问会出现以下情况

三、POST请求参数获取

原理

对于POST请求的处理，koa2没有封装获取参数的方法，需要通过解析上下文context中的原生node.js请求对象req，将POST表单数据解析成query string（例如：a=1&b=2&c=3），再将query string 解析成JSON格式（例如：{"a":"1", "b":"2", "c":"3"}）

注意：ctx.request是context经过封装的请求对象，ctx.req是context提供的node.js原生HTTP请求对象，同理ctx.response是context经过封装的响应对象，ctx.res是context提供的node.js原生HTTP请求对象。

具体koa2 API文档可见

解析出POST请求上下文中的表单数据

demo源码

// 解析上下文里node原生请求的POST参数function parsePostData( ctx ) {  return new Promise((resolve, reject) => {    try {      let postdata = "";      ctx.req.addListener('data', (data) => {        postdata += data      })      ctx.req.addListener("end",function(){        let parseData = parseQueryStr( postdata )        resolve( parseData )      })    } catch ( err ) {      reject(err)    }  })}// 将POST请求参数字符串解析成JSONfunction parseQueryStr( queryStr ) {  let queryData = {}  let queryStrList = queryStr.split('&')  console.log( queryStrList )  for (  let [ index, queryStr ] of queryStrList.entries()  ) {    let itemList = queryStr.split('=')    queryData[ itemList[0] ] = decodeURIComponent(itemList[1])  }  return queryData}

举个例子

源码在 /demos/request/post.js中

例子代码

const Koa = require('koa')const app = new Koa()app.use( async ( ctx ) => {  if ( ctx.url === '/' && ctx.method === 'GET' ) {    // 当GET请求时候返回表单页面    let html = `      koa2 request post demo
      
           
    userName
        
    
    
        
    nickName
        
    
    
        
    email
        
    
    
        
          
   
    `    ctx.body = html  } else if ( ctx.url === '/' && ctx.method === 'POST' ) {    // 当POST请求的时候，解析POST表单里的数据，并显示出来    let postData = await parsePostData( ctx )    ctx.body = postData  } else {    // 其他请求显示404    ctx.body = '404！！！ o(╯□╰)o
'  }})// 解析上下文里node原生请求的POST参数function parsePostData( ctx ) {  return new Promise((resolve, reject) => {    try {      let postdata = "";      ctx.req.addListener('data', (data) => {        postdata += data      })      ctx.req.addListener("end",function(){        let parseData = parseQueryStr( postdata )        resolve( parseData )      })    } catch ( err ) {      reject(err)    }  })}// 将POST请求参数字符串解析成JSONfunction parseQueryStr( queryStr ) {  let queryData = {}  let queryStrList = queryStr.split('&')  console.log( queryStrList )  for (  let [ index, queryStr ] of queryStrList.entries()  ) {    let itemList = queryStr.split('=')    queryData[ itemList[0] ] = decodeURIComponent(itemList[1])  }  return queryData}app.listen(3000, () => {  console.log('[demo] request post is starting at port 3000')})

启动例子

node post.js

访问页面

提交表单发起POST请求结果显示

四、koa-bodyparser中间件

原理

对于POST请求的处理，koa-bodyparser中间件可以把koa2上下文的formData数据解析到ctx.request.body中

安装koa2版本的koa-bodyparser@3中间件

npm install --save koa-bodyparser@3