Koa.js - 表单数据

表单是网络不可或缺的一部分。我们访问的几乎每个网站都提供表单,用于提交或获取一些信息。要开始使用表单,我们首先要安装 koa-body。要安装它,请转到您的终端并使用 −

$ npm install --save koa-body

用以下代码替换您的 app.js 文件内容。

var koa = require('koa');
var router = require('koa-router');
var bodyParser = require('koa-body');
var app = koa();

//设置 Pug
var Pug = require('koa-pug');
var pug = new Pug({
   viewPath: './views',
   basedir: './views',
   app: app //相当于 app.use(pug)
});

//设置 body 解析中间件
app.use(bodyParser({
   formidable:{uploadDir: './uploads'},
   multipart: true,
   urlencoded: true
}));

_.get('/', renderForm);
_.post('/', handleForm);

function * renderForm(){
   this.render('form');
}
function *handleForm(){
   console.log(this.request.body);
   console.log(this.req.body);
   this.body = this.request.body; //这是存储解析请求的地方
}

app.use(_.routes());
app.listen(3000);

我们在这里做的新事情是导入 body 解析器和 multer。我们使用 body 解析器来解析 json 和 x-www-form-urlencoded 标头请求,而我们使用 multer 来解析 multipart/form-data。

让我们创建一个 html 表单来测试一下!使用以下代码创建一个名为 form.pug 的新视图。

html
   head
      title Form Tester
   body
      form(action = "/", method = "POST")
         div
            label(for = "say") Say: 
            input(name = "say" value = "Hi")
         br
         div
            label(for = "to") To: 
            input(name = "to" value = "Koa form")
         br
         button(type = "submit") Send my greetings

使用以下方式运行你的服务器 −

nodemon index.js

现在转到 localhost:3000/ 并根据需要填写表单,然后提交。您将收到响应作为 −

Form Received

查看您的控制台,它将以 JavaScript 对象的形式显示您的请求正文。例如 −

Form Console

this.request.body 对象包含您解析的请求正文。要使用该对象的字段,只需将它们用作普通 JS 对象即可。

这只是发送请求的一种方法。还有许多其他方法,但这些方法与此处介绍无关,因为我们的 Koa 应用程序将以相同的方式处理所有这些请求。要了解有关发出请求的不同方式的更多信息,请查看页面。