ExpressJS - 表单数据

ExpressJS - 表单数据 首页 / ExpressJS入门教程 / ExpressJS - 表单数据

表单(Form)是网络不可或缺的一部分,这些表单可以为无涯教程提交或获取一些信息。要开始使用表单,将首先安装 body-parser (用于解析JSON和url编码的数据)和multer(用于解析multipart/form data)中间件。

要安装 body-parser multer ,请转到您的终端并使用-

npm install --save body-parser multer

将您的 index.js 文件内容替换为以下代码-

无涯教程网

var express=require('express');
var bodyParser=require('body-parser');
var multer=require('multer');
var upload=multer();
var app=express();

app.get('/', function(req, res){
   res.render('form');
});

app.set('view engine', 'pug');
app.set('views', './views');

//for parsing application/json
app.use(bodyParser.json()); 

//for parsing application/xwww-
app.use(bodyParser.urlencoded({ extended: true })); 
//form-urlencoded

//for parsing multipart/form-data
app.use(upload.array()); 
app.use(express.static('public'));

app.post('/', function(req, res){
   console.log(req.body);
   res.send("recieved your request!");
});
app.listen(3000);

导入body-parser和multer后,将使用 body-parser 解析json和x-www-form-urlencoded请求,而将使用 multer 进行解析multipart/form data。

让无涯教程创建一个html表单进行测试。使用以下代码创建一个名为 form.pug 的新视图-

链接:https://www.learnfk.comhttps://www.learnfk.com/expressjs/expressjs-form-data.html

来源:LearnFk无涯教程网

html
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="Express forms")
         br
         button(type="submit") Send my greetings

使用以下命令运行服务器。

nodemon index.js

现在转到localhost:3000 /并根据需要填写表格,然后提交。将显示以下响应-

Response to form submission

看一下您的控制台;它将以JavaScript对象的形式显示请求的主体,如以下屏幕截图所示-

Console output for form

req.body 对象包含您已解析的请求正文。要使用该对象中的字段,只需像普通JS对象一样使用它们即可。

祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)

技术教程推荐

代码精进之路 -〔范学雷〕

面试现场 -〔白海飞〕

后端技术面试 38 讲 -〔李智慧〕

爱上跑步 -〔钱亮〕

Django快速开发实战 -〔吕召刚〕

Python自动化办公实战课 -〔尹会生〕

说透数字化转型 -〔付晓岩〕

高并发系统实战课 -〔徐长龙〕

AI 应用实战课 -〔黄佳〕

好记忆不如烂笔头。留下您的足迹吧 :)