koa2 入坑（1）之处理get/post请求

一、安装

要求Node.js版本高于V7.6。因为node.js 7.6版本开始完全支持async/await,不需要再加flag，所以才能完全你支持我们的Koa2。

npm install --save koa

demo：

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

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

app.listen(3000);
console.log('http://127.0.0.1:3000');

Koa 提供一个 Context 对象，表示一次对话的上下文（包括 HTTP 请求和 HTTP 回复）。通过加工这个对象，就可以控制返回给用户的内容。简写 ctx
ctx.body 就是发送给web的对象 页面中打印出 ctx ：

image.png

• async/await的使用方法

• async是声明一个方法是异步的，await是等待异步方法完成
• 注意的是await必须在async方法中才可以使用因为await访问本身就会造成程序停止堵塞，所以必须在异步方法中才可以使用

• async到底起什么作用？
  async是让方法变成异步，这个很好理解，关键是他的返回值是什么？我们得到后如何处理？

根据以前的经验，我们希望用return直接返回async函数的值，但是如果真是这样，还有await什么作用，我们写段代码测试一下。

async function testAsync(){
    return 'Hello async';
}
const result = testAsync();
console.log(result);

image.png

可以看到返回的是一个Promise对象，对象里面是定义函数的 ·return的返回值

• await在等什么？

await一般在等待async方法执行完毕，但是其实await等待的只是一个表达式，这个表达式在官方文档里说的是Promise对象，可是它也可以接受普通值。我们写一段代码来验证一下这个结果。

function getSomething(){
    return 'something';
}

async function testAsync(){
    return 'Hello async';
}

async function test(){
    const v1=await getSomething(); // 普通值
    const v2=await testAsync(); // Promise对象
    console.log(v1,v2);
}

test();

image.png

• async/await 同时使用

通过前面两个例子已经分别了解async和await，我们来作个虚假的例子，看一下等待问题。这只是一个虚假的，实际项目中多是去后台请求数据，等数据回来后进行执行。

function takeLongTime() {
    return new Promise(resolve => {
        setTimeout(() => resolve("long_time_value"), 2000);
    });
}

async function test() {
    const v = await takeLongTime();
    console.log(v);
}

test();

image.png

可以看到 并没有发生阻塞 这正是 async await的作用~~~

三、处理get请求

query和querystring区别

在koa2中GET请求通过request接收，但是接受的方法有两种：query和querystring。

• query：返回的是格式化好的参数对象。
• querystring：返回的是请求字符串。

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

app.use(async(ctx)=>{
    // ctx.body = 'hello';
    let url = ctx.url;
    let request = ctx.request;
    let req_query = request.query;
    let req_queryString = request.querystring;

    ctx.body = {
        url,
        req_query,
        req_queryString
    }
});

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

image.png

json 格式化插件 JSON Formatter

直接从ctx中获取Get请求

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

app.use(async(ctx)=>{
    // 从request 中接收get请求
    let url = ctx.url;
    let request = ctx.request;
    let req_query = request.query;
    let req_queryString = request.querystring;

    // 从上下文中ctx 直接获取get请求
    let ctx_query = ctx.query;
    let ctx_querystring = ctx.querystring;

    ctx.body = {
        url,
        req_query,
        req_queryString,
        ctx_query,
        ctx_querystring,
    }
});

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

image.png

二、处理POST请求

获取Post请求的步骤：

• 解析上下文ctx中的原生nodex.js对象req。
• 将POST表单数据解析成query string-字符串.(例如:user=gershon&age=18)
• 将字符串转换成JSON格式。

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

app.use(async (ctx) => {
    if (ctx.url === '/' && ctx.method === 'GET') {
        //显示表单页面
        let html = `
            
koa2 request POST
            

            
userName
 
              

            
age
            
            
website
    
                
            submit 
            
        `;
        ctx.body = html;

    } else if (ctx.url === '/' && ctx.method === 'POST') {
        let postData = await parsePostData(ctx);
        ctx.body = postData;

    } else {
        ctx.body = '
404
'
    }

    function parsePostData() {
        return new Promise((resolve, reject) => {
            try {
                let postData = '';
                ctx.req.addListener('data', (data) => { // 有数据传入的时候
                    postData += data;
                });
                ctx.req.on('end', () => {
                    let parseData = parseQueryStr(postData);
                    resolve(parseData);
                });
            } catch (e) {
                reject(e);
            }
        })
    }

    // 处理 string => json
    function parseQueryStr(queryStr) {
        let queryData = {};
        let queryStrList = queryStr.split('&');
        console.log('queryStrList',queryStrList);
        console.log('queryStrList.entries()',queryStrList.entries());
        for(let [index,queryStr] of queryStrList.entries()){
            let itemList = queryStr.split('=');
            console.log('itemList',itemList);
            queryData[itemList[0]] = decodeURIComponent(itemList[1]);
        }
        return queryData;
    }
});
app.listen(3000, () => {
    console.log('http://127.0.0.1:3000');
});

image.png

image.png

阮一峰 koa教学
jsPang koa教学