formidable模块——一个Node.js模块
夔博
formidable模块是一个Node.js模块，主要用于解析表单，支持get post请求参数，文件上传等。
下载 formidable 模块
可以通过 npm 下载，模块的引入还是用通过 require 。
npm i formidable
创建解析对象
创建解析对象有四种方式，每种方式都可以使用并且没有区别
const formidable = require('formidable');
const form = formidable(options);
const { formidable } = require('formidable');
const form = formidable(options);
const { IncomingForm } = require('formidable');
const form = new IncomingForm(options);
const { Formidable } = require('formidable');
const form = new Formidable(options);;
在创建对象的时候，我们可以传入参数，option 是一个对象，下面我列举部分参数，option 对象中的每个属性都是非必须的。
- encoding ：设置表单域的编码，默认为utf-8
- uploadDir ：设置上传文件存放的文件夹，默认为系统的临时文件夹，可以使用fs.rename()来改变上传文件的存放位置和文件名
- keepExtensions ：设置该属性为true可以使得上传的文件保持原来的文件的扩展名，默认为false
- maxFieldsSize ：限制上传文件的大小，如果超出，则会触发error事件，默认为2M
- maxFields ：设置可以转换多少查询字符串，默认为1000
解析表单信息
在解析对象完成之后，我们就可以开始对表单进行解析了。具体语法是：form.parse(request, callback)。
- request：表示请求信息，因为我们是对表单进行解析，所以首先需要获取到表单信息，所以这个参数是 request 事件的第一个参数。
- callback：表示一个回调函数，接收解析完成之后的信息。有三个参数(err, fields, files)，分别表示err请求出错信息，fields普通请求参数，files上传文件请求参数
formidable 模块中包含的事件
在使用parse方法对表单进行解析时，解析对象经历了一系列过程，我们可以监听这些过程从而完成某些操作，这些过程我们可以理解为事件。
- progress：当有数据块被处理之后会触发该事件。具体语法：
form.on('progress', (bytesReceived, bytesExpected) => {}); - field：每当一个字段 / 值对已经收到时会触发该事件。具体语法：
form.on('field', (name, value) => {}); - fileBegin：在post流中检测到任意一个新的文件便会触发该事件。具体语法：
form.on('fileBegin', (name, file) => {}); - file：每当有一对字段/文件已经接收到，便会触发该事件。具体语法：
form.on('file', (name, file) => {}); - error：当上传流中出现错误便会触发该事件，当出现错误时，若想要继续触发request的data事件，则必须手动调用request.resume()方法。具体语法：
form.on('error', (err) => {}); - aborted：当用户中止请求时会触发该事件。具体语法：
form.on('aborted', () => {}); - end：当所有的请求已经接收到，并且所有的文件都已上传到服务器中，该事件会触发。具体语法：
form.on('end', () => {});
具体实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
label {
display: inline-block;
width: 70px;
margin-right: 5px;
text-align: right;
}
</style>
</head>
<body>
<form action="http://localhost:8989/index" enctype="multipart/form-data" method="POST">
<label for="#username">用户名：</label>
<input type="text" name="username" class="username" id="username">
<br />
<br />
<label for="#userpass">密码：</label>
<input type="password" name="userpass" id="userpass">
<br />
<br />
<label for="#userpass">照片：</label>
<input type="file" name="userimg" id="userage">
<br />
<br />
<label for="">性别：</label>
<label for=""> <input type="radio" name="usersex" class="usersex" checked value="男">男</label>
<label for=""> <input type="radio" name="usersex" class="usersex" value="女">女</label>
<br />
<button id="submit" type="submit">提交</button>
</form>
</body>
</html>
在使用js时必须保证已经将Node.js安装
const http = require('http');
const url = require('url');
const formidable = require('formidable');
let server = http.createServer((req, res) => {
res.setHeader("Access-Control-Allow-Origin", "*");
res.writeHead(200, { 'Content-Type': 'text/html; charset=utf8' });
let urlObj = url.parse(req.url, true);
let params = urlObj.query;
if (urlObj.path == "/index") {
const form = formidable();
if (req != null) {
form.parse(req, (err, fielads, files) => {
console.log("fielads", fielads);
console.log("files", files);
});
form.on('progress', (bytesReceived, bytesExpected) => {
console.log("收到的字节数" + bytesReceived);
console.log("预期字节数" + bytesExpected);
});
form.on('field', (name, value) => {
console.log(name + " = " + value);
});
form.on('fileBegin', (name, file) => {
console.log(name + " = ", file);
});
form.on('file', (name, file) => {
console.log(name + " = ", file);
});
form.on('end', () => {
console.log('结束解析');
});
}
}
res.end();
});
server.listen(8989);
类似资料：