koa处理formdata_koa处理post请求

1. 获取post请求的步骤

解析上下文的ctx文原生node.js的对象rep

将post表单数据解析成query string 字符串

将字符串转化为json格式

2. ctx.request和ctx.req的区别

ctx.request是Koa2中context经过封装的请求对象，它用起来更加简单；

ctx.req是context提供的原生的HTTP请求对象，这个虽然不算太直接，但是可以提供更多的内容，适合我们深度编程；

3 . method请求类型

Koa2中提供了 ctx.method属性，可以轻松的得到请求的类型。然后根据不同的请求类型编写不同的方法

比如

const Koa=require('koa')

const app=new Koa()

app.use(async(ctx)=>{

if(ctx.url=='/'&& ctx.method=='GET'){

let html =`

Koa2 request post demo

userName

age

webSite

submit

`;

ctx.body =html;

}else if(ctx.url==='/' && ctx.method === 'POST'){

ctx.body='接收到请求';

}else{

//其它请求显示404页面

ctx.body='

404!

';

}

})

app.listen(3000,()=>{

console.log('[demo] server is starting at port 3000');

})

然后node执行 node index.js

get请求.png

点击sumit后变为post请求.png

404.png

4 . post 请求接受参数，并处理

在上述文件中加入该方法

function paresPostData(ctx){

return new Promise((resolve,reject)=>{

try{

let postData=''

ctx.req.addListener('data',(data)=>{

postData+=data

})

ctx.req.on('end', ()=>{

resolve(postData)

})

}catch(err){

reject(err)

}

})

}

如果是post请求，此处跟改为

else if(ctx.url==='/' && ctx.method === 'POST'){

let postData= await paresPostData(ctx)

ctx.body=postData;

}

再次点击submit

image.png

image.png

5 . 将json字符串转化为json格式

function parseData(queryStr){

let queryData={}

// 先分割 变为[ username=mjc]

let queryList=queryStr.split('&')

// for of 循环 entries() 方法返回一个数组的迭代对象，

// 该对象包含数组的键值对 (key/value)。

for(let [index, queryItem] of queryList.entries()){

let itemList= queryItem.split('=')

// itemList 为 [ username ,mjc]

queryData[itemList[0]]=decodeURIComponent(itemList[1])

}

return queryData

}

在将parseData 导入封装的post请求

最后贴出完整代码

const Koa=require('koa')

const app=new Koa()

app.use(async(ctx)=>{

if(ctx.url=='/'&& ctx.method=='GET'){

let html =`

Koa2 request post demo

userName

age

webSite

submit

`;

ctx.body =html;

}else if(ctx.url==='/' && ctx.method === 'POST'){

let postData=await paresPostData(ctx)

ctx.body=postData

}else{

//其它请求显示404页面

ctx.body='

404!

';

}

})

function paresPostData(ctx){

return new Promise((resolve,reject)=>{

try{

let postData=''

ctx.req.addListener('data',(data)=>{

postData+=data

})

ctx.req.on('end', ()=>{

let postdata=parseData(postData)

resolve(postdata)

})

}catch(err){

reject(err)

}

})

}

function parseData(queryStr){

let queryData={}

let queryList=queryStr.split('&')

for(let [index, queryItem] of queryList.entries()){

let itemList= queryItem.split('=')

queryData[itemList[0]]=decodeURIComponent(itemList[1])

}

return queryData

}

app.listen(3000,()=>{

console.log('[demo] server is starting at port 3000');

})

效果图：

image.png

image.png