一般的には、クライアントがサーバにデータを提出する必要がありGET、かつPOST、前の2つの記事で簡単にURL HTTPモジュールとの間で、モジュールのNode.js我々はを通じて知ることができているreq.urlとurlすぐに処理モジュールをクライアントに取得することができますGETサーバモードに提出されたデータ。ネイティブnode.jsの取り扱いクライアントPOST経由で提出されたデータは、ファイルがより困難であり、書き、写真をアップロードするには、2人のリスナーが処理されるために、より複雑です。したがって、我々は、サードパーティのモジュールパッケージを使用formidable中のクライアントに対処するPOSTようにフォームの送信、文書、写真と。
、驚異POSTフォームデータ処理が送信します
1.ダウンロードしてリードパック
現在のプロジェクトフォルダには、コマンドを使用し-> npm install formidable 、現在のフォルダをダウンロードしますformidable。そしてを通じてconst formidable = require('formidable');、パッケージのリードに。
2、フォームの基本構造を作成します
私たちは、フォームページを作成するform.htmlメインファイルと、サーバー上の1.js同じディレクトリにあります。下図のように：
メイン文書では1.js、我々は、フォームのページを提示し、ルートディレクトリへのユーザーアクセスは、ユーザーがして、フォームを完了した情報に記入する際のルートを設計しsubmit、後でルートにデフォルトのジャンプのために提出しhttp://192.168.155.1:3000/dopost、（指定したポート番号を追加してください） 、我々はそれらを使用するためにしたルート設計formidable処理のために。1.jsスケルトンコードのマスターファイルには、次のとおりです。
CONST驚異=は（「驚異」）が必要。
CONSTのfs =は（ 'FS'）を必要とします。
CONSTパス=（「パス」）を必要とします。
constがHTTP =（ 'のhttp'）が必要です。
VARサーバ= http.createServer（（REQ、RES）=> {
IF（req.url == '/'）{
VARターゲット= path.join（__ dirnameは、 '/ form.html。'）;
fs.readFile（ターゲット、（ERR、データ）=> {
（ERR）スローERR場合、
res.writeHead（200、{ "コンテンツタイプ"： "text / htmlの;のcharset = UTF8"}）。
res.end（データ）。
}）;
}そうであれば（req.url == '/ doPostメソッド' && req.method.toLowerCase（）== '後'）{
}他{
res.writeHead（404、{ "コンテンツタイプ"： "text / htmlの;のcharset = UTF8"}）。
res.end（「ページが見つかりません！」）;
}
}）;
server.listen（3000、 '192.168.155.1'）。
驚異を使用して図3に示すように、処理されたフォームデータ
共通のコードセグメント
VARフォーム=新しいformidable.IncomingForm（）;
form.parse（REQ、関数（ERR、フィールド、ファイル）{}）;
クライアントによって受信されたサーバー場合はpost、フォームデータの提出後は、コールバック関数の実行をトリガします。するにはpost、フィールドのデータ提出を形成する上にあるfieldsこの主題にするためにこれ、postファイルのフィールド上のファイル、写真、その他のデータをアップロードfiles中でオブジェクト。
私たちはその後、ルートブランチを選択された2番目のコードサンプル：
それ以外の場合（req.url == '/ doPostメソッド' && req.method.toLowerCase（）== 'ポスト'）{
VARフォーム=新しいformidable.IncomingForm（）;
form.parse（REQ、関数（errは、フィールド、ファイル）{
（ERR）スローERR場合、
console.log（フィールド）;
res.writeHead（200、{ "コンテンツタイプ"： "text / htmlの;のcharset = UTF8"}）。
res.end（ 'フォームが正常に送信！'）;
}）;
}
完全なフォームデータが完了し提出この時間の後、結果は次のとおりです。
二、手ごわい取り扱いPOSTメソッドは、ファイルや画像をアップロードします
上述した実施形態を介してパッケージリードをダウンロードした後、form.htmlメインファイルのファイルが1.js同じディレクトリ内にまだform.htmlあるサンプルコード：
<！DOCTYPE HTML>
<HTML LANG = "EN">
<ヘッド>
<メタ文字セット= "UTF-8">
<タイトル>フォーム表单</ TITLE>
</ head>の
<body>
<form action="http://192.168.155.1:3000/dopost" method="POST" enctype="multipart/form-data">
<p><input type="file" name="uploadImg"></p>
<p><input type="submit" value="提交"></p>
</form>
</body>
</html>
当表单提交的过程中涉及文件或图片上传，则一定要设置表单头，即在form标签上加上固定写法的属性为
enctype="multipart/form-data"，否则文件或图片会上传失败。其中<input type="file" name="uploadImg">，当中的name属性一定要赋值。
其中主文件1.js的骨架代码也与上述的相似。当要使用formidable来处理上传的图片时，常用的代码段为：
var form = new formidable.IncomingForm();
form.uploadDir = targetFile;
form.parse(req,function(err,fields,files){});
其中targetFile为一个自定义的变量，用于设置文件或图片上传的存放路径，为绝对物理路径。该目标地址的文件夹必须能实现存在，这样才能确保文件能顺利上传。其中当服务端全部接收完客户端用post方式提交的文件或图片之后，触发执行该回调函数。以post方式提交的表单域数据都放在fields这个对象当中，以post方式上传的文件、图片等文件域数据都放在files这个对象当中。则我们在第二条路由选择的分支当中的代码示例为：
else if(req.url == '/dopost' && req.method.toLowerCase() == 'post'){
var form = new formidable.IncomingForm();
var targetFile = path.join(__dirname,'./upload');
form.uploadDir = targetFile;
form.parse(req,function(err,fields,files){
if(err) throw err;
console.log(files);
res.writeHead(200,{"Content-Type":"text/html;charset=UTF8"});
res.end('表单提交成功！');
});
}
在完成图片的选择与上传之后，结果为：
此时可以看到在主文件1.js的同一目录下的upload文件夹当中多了一个随机名字，并且没有后缀名的文件。由于没有后缀名，所以该图片在编辑器当中无法正常显示。
我们可以在接收到上传的图片之后，使用fs.rename()方法对其进行改名的操作，使其上传之后的文件名与之前的保持一致，并且包含后缀名的部分。
我们从控制台打印的信息可以看出其中files.uploadImg.path代表该图片上传之后存放的绝对物理路径。其中files.uploadImg.name代表该图片原来的文件名部分（包含扩展名的信息）。我们加入了上传改名的功能之后，第二条路由选择分支当中的示例代码为：
else if(req.url == '/dopost' && req.method.toLowerCase() == 'post'){
var form = new formidable.IncomingForm();
var targetFile = path.join(__dirname,'./upload');
form.uploadDir = targetFile;
form.parse(req,function(err,fields,files){
if(err) throw err;
var oldpath = files.uploadImg.path;
var newpath = path.join(path.dirname(oldpath),files.uploadImg.name);
fs.rename(oldpath,newpath,(err)=>{
if(err) throw err;
res.writeHead(200,{"Content-Type":"text/html;charset=UTF8"});
res.end('图片上传并改名成功！');
})
});
}