概述
本文主要利用node搭建服務器,配置路由,處理請求,最終實現了圖片上傳及在瀏覽器中展示功能。
功能模塊
- index.js 入口文件
- server.js 服務器搭建
- routes.js 配置路由
- requestHandles.js 處理請求
架構梳理
- indes.js作爲入口文件,配置不同路由的請求處理函數;並把touter和handler處理函數對象傳遞給 server.js
- server.js 響應請求,把請求&響應數據&處理函數傳遞給 router.js;
- router.js 根據傳遞的路由,路徑進行調用 handler處理函數
- requestHandles.js 定義不同路由的處理函數
知識點
- 模塊分離
- 利用child_process 非阻塞模型
- 表單處理包formidable
index.js同級目錄下新建tmp文件夾。
運行 npm install formidable; node indes.js
index.js
var server = require('./server.js');
var router = require('./router.js');
var requestHandles = require('./requestHandles');
var handle = {};
handle['/'] = requestHandles.start;
handle['/start'] = requestHandles.start;
handle['/upload'] = requestHandles.upload;
handle['/show'] = requestHandles.show;
server.start(router.route, handle);
server.js
var http = require('http');
var url = require('url');
/*function start(route, handle) {
function onRequest(request, response) {
var postData = '';
var pathname = url.parse(request.url).pathname;
console.log('request for ' + pathname + ' recevied');
request.setEncoding('utf8');
request.addListener('data', function(postDataChunk) {
postData += postDataChunk;
console.log("Received POST data chunk '" +
postDataChunk + "'.");
})
request.addListener('end', function() {
route(handle, pathname, response, postData);
})
}
http.createServer(onRequest).listen(8888);
console.log('server start');
}*/
function start(route, handle) {
function onRequest(request, response) {
var pathname = url.parse(request.url).pathname;
console.log("Request for " + pathname + " received.");
route(handle, pathname, response, request);
}
http.createServer(onRequest).listen(8888);
console.log("Server has started.");
}
exports.start = start;
routes.js
/*function route(handle, pathname, response, postData) {
console.log('about to route a request for ' + pathname);
if (typeof handle[pathname] === 'function') {
handle[pathname](response, postData);
} else {
console.log('not request handler found for ' + pathname);
response.writeHead(404, { "Content-Type": "text/plain" });
response.write('404 not found');
response.end();
}
}*/
function route(handle, pathname, response, request) {
console.log("About to route a request for " + pathname);
if (typeof handle[pathname] === 'function') {
handle[pathname](response, request);
} else {
console.log("No request handler found for " + pathname);
response.writeHead(404, { "Content-Type": "text/html" });
response.write("404 Not found");
response.end();
}
}
exports.route = route;
requestHandles.js
var exec = require('child_process').exec;
var querystring = require("querystring");
var fs = require('fs');
var formidable = require("formidable");
function start(response, postData) {
console.log('request handle "start" is called');
//非阻塞操作
/*exec("ls-lah", function(error, stdout, stderr) {
response.writeHead(200, { 'Content-Type': 'text/plain' });
response.write(stdout);
response.end();
})*/
var body = '<html>' +
'<head>' +
'<meta http-equiv="Content-Type" ' +
'content="text/html; charset=UTF-8" />' +
'</head>' +
'<body>' +
'<form action="/upload" enctype="multipart/form-data" ' +
'method="post">' +
'<input type="file" name="upload">' +
'<input type="submit" value="Upload file" />' +
'</form>' +
'</body>' +
'</html>';
response.writeHead(200, { 'Content-Type': 'text/html' });
response.write(body);
response.end();
}
/*function upload(response, postData) {
console.log('request handle "upload" is called');
response.writeHead(200, { "Content-Type": "text/plain" });
response.write("You've sent: " + querystring.parse(postData).text);
response.end();
}*/
function upload(response, request) {
console.log("Request handler 'upload' was called.");
var form = new formidable.IncomingForm();
console.log("about to parse");
form.parse(request, function(error, fields, files) {
console.log("parsing done");
fs.renameSync(files.upload.path, "./tmp/test.jpg");
response.writeHead(200, { "Content-Type": "text/html" });
response.write("received image:<br/>");
response.write("<img src='/show' />");
response.end();
});
}
function show(response, postData) {
console.log('request handle "show" is called');
fs.readFile('./tmp/test.jpg', "binary", function(error, file) {
if (error) {
response.writeHead(500, { "Content-Type": "text/plain" });
response.write(error + '\n');
response.end();
} else {
response.writeHead(200, { "Content-Type": "image/jpg" });
response.write(file, "binary");
response.end();
}
})
}
exports.start = start;
exports.upload = upload;
exports.show = show;
參考文獻:https://www.nodebeginner.org/index-zh-cn.html#how-function-passing-makes-our-http-server-work