天天看點

Node.js Express 架構2

檔案上傳

以下我們建立一個用于上傳檔案的表單,使用 POST 方法,表單 enctype 屬性設定為 multipart/form-data。

index.html

<html>
<head>
<title>檔案上傳表單</title>
</head>
<body>
<h3>檔案上傳:</h3>
選擇一個檔案上傳: <br />
<form action="/file_upload" method="post" enctype="multipart/form-data">
<input type="file" name="image" size="50" />
<br />
<input type="submit" value="上傳檔案" />
</form>
</body>
</html>
      

  

server.js

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

var fs=require('fs');
var multer=require('multer');

app.use(express.static('public'));
//建立application/x-www-form-urlencoded編碼解析
app.use(bodyParser.urlencoded({extended:false}));
app.use(multer({dest:'/tmp/'}).array('image'));

var server=app.listen(8081,onRequest);

app.post('/file_upload',function(req,res){
	
	console.log(req.files[0]);//上傳檔案資訊
	
	var des_file=__dirname+'/'+req.files[0].originalname;
	fs.readFile(req.files[0].path,function(err,data){
		fs.writeFile(des_file,data,function(err){
			if(err){
				console.log(err);
			}else{
				response={
					message:'File upload successfully',
					filename:req.files[0].originalname
				};
			}
			console.log(response);
			res.end(JSON.stringify(response));
		});
	});
});

app.get('/index.html',function(req,res){
	res.sendFile(__dirname+'/'+'index.html');
});

function onRequest(){
	var host=server.address().address;
	var port=server.address().port;
	console.log('應用執行個體,通路位址為 http://%s:%s', host,port);
}
      

浏覽器通路 http://127.0.0.1:8081/index.htm,如圖所示:

Node.js Express 架構2

傳回資訊:

Node.js Express 架構2
Node.js Express 架構2

到server.js的目錄檢視,檔案已經上傳:

Node.js Express 架構2

繼續閱讀