koa post提交数据,koa-bodyparser中间件来获取post提交数据
原生 Nodejs 获取 post 提交数据
首先创建并初始化一个node应用,根路由使用index.ejs模板
var Koa=require('koa')
var router = require('koa-router')()
var views = require('koa-views')
var app=new Koa();
app.use(views('views',{
extension:'ejs'
}))
router.get('/',async (ctx)=>{
await ctx.render('index');
})
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3000);
在views目录下创建一个index.ejs模板(注意需要安装ejs插件) ,跟配置模板的路劲一致
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="/doAdd" method="post">
用户名: <input type="text" name="username"/>
<br/>
<br/>
密 码: <input type="password" name="password"/>
<br/>
<br/>
<button type="submit">提交</button>
</form>
</body>
</html>
然后启动node应用,并且浏览器访问

当在浏览器端输入了这两个输入框点提交后,node应用接收传过来的数据,封装一个获取数据的方法,并且在app.js引用
exports.getPostData=function(ctx){
//获取数据 异步
return new Promise(function(resolve,reject){
try{
let str='';
ctx.req.on('data',function(chunk){
str += chunk;
})
ctx.req.on('end',function(chunk){
resolve(str)
})
}catch(err){
reject(err)
}
})
}
var Koa=require('koa')
var router = require('koa-router')()
var views = require('koa-views')
var common = require('./module/common')
var app=new Koa();
app.use(views('views',{
extension:'ejs'
}))
router.get('/',async (ctx)=>{
await ctx.render('index');
})
router.post('/doAdd', async (ctx) => {
var data = await common.getPostData(ctx)
console.log(data)
ctx.body = data // 提交完成后给浏览器响应的数据
})
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3000);
重启服务后,浏览器端在两个输入框中输入数据点击提交,下面看到的乱码是因为中文,提交的时候要记得处理一下


Koa 中 koa-bodyparser 中间件的使用
首先需要在项目中安装这个插件
npm install --save koa-bodyparser
在项目中引入这个插件,并且需要配置post bodyparser的中间件
var Koa=require('koa')
var router = require('koa-router')()
var views = require('koa-views')var bodyParser = require('koa-bodyparser')
var app=new Koa();
app.use(views('views',{
extension:'ejs'
}))
//配置post bodyparser的中间件
app.use(bodyParser());
router.get('/',async (ctx)=>{
await ctx.render('index');
})
router.post('/doAdd', async (ctx) => {
console.log(ctx.request.body);
ctx.body = ctx.request.body; //获取表单提交的数据
})
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3000);
重启服务后,浏览器访问并且输入数据提交,可以看到这个插件将我们获取到的数据转成了一个对象


该插件已经帮你解决了中文乱码的问题,不信你试试输入中文看看结果


koa post提交数据,koa-bodyparser中间件来获取post提交数据的更多相关文章
- springboot框架中集成thymeleaf引擎,使用form表单提交数据,debug结果后台获取不到数据
springboot框架中集成thymeleaf引擎,使用form表单提交数据,debug结果后台获取不到数据 表单html: <form class="form-horizontal ...
- nodejs数据接收body-parser中间件
给大家翻译一下npm上body-parser的资料 nodejs 的body数据解析中间件 插件作用:对于req.body属性,在操作数据前分析进来的请求体的插件 首先学习解析一个http处理 这篇文 ...
- 速战速决 (6) - PHP: 获取 http 请求数据, 获取 get 数据 和 post 数据, json 字符串与对象之间的相互转换
[源码下载] 速战速决 (6) - PHP: 获取 http 请求数据, 获取 get 数据 和 post 数据, json 字符串与对象之间的相互转换 作者:webabcd 介绍速战速决 之 PHP ...
- 3、KOA模板引擎+访问静态资料中间件
一.Koa模板引擎初识1.安装中间件 : npm i --save koa-views2.安装ejs模板引擎 :npm i --save ejs3.编写模板:<%= title %> 是调 ...
- 使用node.js的bodyParser中间件读取post数据解析
昨天我们使用的网关转发数据时出了点问题! 情景是这样的,另一方以Post的形式向我的node.js服务推送JSON数据.但是使用bodyParser中间件后,在req.body中拿不到任何信息. 代码 ...
- bodyParser中间件的研究
原文链接: bodyParser中间件 bodyParser中间件用来解析http请求体,是express默认使用的中间件之一. 使用express应用生成器生成一个网站,它默认已经使用了 bodyP ...
- Express bodyParser中间件使用方式
bodyParser中间件用来解析http请求体,是express默认使用的中间件之一. 1.这个模块提供以下解析器 (1) JSON body parser (2) Raw body parser ...
- express第三方中间件研究之bodyParser中间件
转载至:http://www.cnblogs.com/lianer/p/5178693.html 接触nodejs已有一段时间了,但最近才开始落实项目,于是使用express应用生成器生成了一个应用. ...
- Koa框架教程,Koa框架开发指南,Koa框架中文使用手册,Koa框架中文文档
我的博客:CODE大全:www.codedq.net:业余草:www.xttblog.com:爱分享:www.ndislwf.com或ifxvn.com. Koa -- 基于 Node.js 平台的下 ...
随机推荐
- Vue学习之项目部分代码(十八)
1.mian.js: // 入口文件 import Vue from "vue"; // 1.1导入路由 import VueRouter from "vue-route ...
- iOS完整学习路线
来源:http://www.cnblogs.com/mjios/p/3226954.html
- 在Linux系统上安装Spring boot应用
Unix/Linux 服务 systemd 服务 操作过程 1. 安装了JDK的centOS7虚拟机 注意下载linux版本JDK的时候不能直接通过wget这种直接链接下载,否则会解压不成功,应该打开 ...
- PDF 补丁丁 0.6.2.3572 测试版发布
近日有网友反馈 3571 测试版的补丁丁无法正常工作.请下载新发布的 3572 版本.
- vue中引入mui报Uncaught TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them的错误
在vue中引入mui的js文件的时候,报如下的错误: 那是因为我们在用webpack打包项目时默认的是严格模式,我们把严格模式去掉就ok了 第一步:npm install babel-plugin-t ...
- JavaScript 解决 url 中的中文乱码问题
页面传值过程中,通过 url 传值,发现中文会乱码. 以下是解决方法: 1.传的页面: encodeURI(url + "?userName=" + userName); //en ...
- 改变默认的多选框 checkbox 样式~
效果图: HTML代码: <label for="Checkbox1" style="display:none;"></label> & ...
- web之表单form
表单是我们平常编写Web应用常用的工具,表单(<form>)用来收集用户提交的数据,发送到服务器.比如,用户提交用户名和密码,让服务器验证,就要通过表单.表单是一个包含表单元素或控件的区域 ...
- Linux操作系统之grub加密实战案例
Linux操作系统之grub加密实战案例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.为grub设置明文密码案例 1>.修改"/boot/grub/grub. ...
- html5添加视频为背景自动播放
客户想做个打开官网自动播放一段视频,楼主使用了video标签,即下面的代码:: 于是我在video标签上添加了属性 autoplay=“autoplay” loop=“loop” 然而通过地址栏进去的 ...