现在的位置: 首页 > 综合 > 正文

node.js学习(2)–路由功能以及表单上传

2017年07月24日 ⁄ 综合 ⁄ 共 3061字 ⁄ 字号 评论关闭

今天按照《node.js入门》这本书学习了node的一些基础知识,包括服务器的创建,路由功能的实现,表单上传和数据处理,感觉开始明白了node.js的一些基本原理。这本书说的很详细也很基础,很适合初学者学习。node.js入门 

众所周知,node跟php语言不一样,node不需要依赖于apache等服务器,因为node本身就能够构建服务器!所以,再用node开发网站之前我们首先得学会如何搭建服务器。关于node创建服务器在我之前的博客已经有介绍,这里不再赘述。

完成一个表单上传与数据处理的demo

1.明确功能,先确定需要建立哪些文件(由于只是demo,我们不需要写html文件,涉及前端的简单处理就好。

服务器文件server.js;程序入口文件index.js;路由文件router.js;请求处理文件 handleRequest.js

首先我们来写入口文件:

<span style="font-size:18px;">var server= require("./server.js");//引入server.js
var router = require("./router.js");
var handle = require("./requestHandlers");

var handles ={};//关联数组用来传递函数。
handles["/"] = handle.start;//这里主要是为了后面的路由功能,用户访问localhost:3000/start就会直接转到start方法
handles["/start"] = handle.start;
handles["/upload"] = handle.upload;

server.start(router.route,handles);</span>

在index文件里面,我们初始化一个关联数组,用来存放需要用到的函数。并且开启服务器。

server文件:

<span style="font-size:18px;">var  http = require("http"); 
//node.js 自带的http模块
var url= require("url");

function start(route,handles){
//创建一个HTTP服务器;
	http.createServer( function (req, res) { //匿名函数
	//大部分服务器会在用户尝试访问localhost:8888时候访问localhost:8888/favicon.ico,这里去除这一访问结果
	if(req.url == '/favicon.ico'){
		return;
	}
	var postData = "";
	var pathname =  url.parse(req.url).pathname;//解析出url里面的路径名
	req.setEncoding("utf8");
	req.addListener("data",function(postDataChunk){//通过回调函数的方式获取post数据
		postData += postDataChunk ;
	});
	req.addListener("end",function(){
		route(handles,pathname,res,postData);
	});
	console.log("Requset"+pathname+"arrived!");
	}).listen(3000);//侦听3000端口号
	console.log("HTTP server has started!");
}  
//将server中的代码写在一个start函数里面。并且将该函数导出,一次完成代码的模块化,在其余的文件中只需要以   var  http = require("http")的形式进行调用; 
exports.start = start;</span>

首先,我们设置了接收数据的编码格式为 UTF-8,然后注册了“data”事件的监听器,用于收集每次接收到的新数据块,并将其赋值给 postData 变量,最后,我们将请求路由的调用移到 end 事件处理程序中,以确保它只会当所有数据接收完毕后才触发,并且只触发一次。我们同时还把 POST 数据传递给请求路由,因为这些数据,请求处理程序会用到。为了使整个过程非阻塞,Node.js会将POST数据拆分成很多小的数据块,然后通过触发特定的事件,将这些小数据块传递给回调函数。这里的特定的事件有
data 事件(表示新的小数据块到达了)以及 end 事件(表示所
有的数据都已经接收完毕)。 

router.js:

<span style="font-size:18px;">function route(handles,pathname,res,postData){
	console.log("About to route a request to"+pathname);
	if(typeof handles[pathname] === 'function'){//通过对路径名称的判断,调用相应的函数进行处理,这是路由的基本思想。
		handles[pathname](res,postData);
	}else{
		console.log("No request handler found for " + pathname); 
	}
}
exports.route=route;</span>

route函数传递三个参数,关联数组handles(保存requestHandlers里面的函数),pathname是访问路径,res是回应对象,postData是post接收的数组。

requestHandles.js

var  querystring = require("querystring");
function start(res){
	var body =  '<html>'+     
	'<head>'+     '<meta http-equiv="Content-Type" content="text/html; '+ 
    'charset=UTF-8" />'+     '</head>'+     
	'<body>'+     '<form action="/upload" method="post">'+     
	'<textarea name="text" rows="20" cols="60"></textarea>'+     
	'<input type="submit" value="Submit text" />'+     
	'</form>'+     '</body>'+     
	'</html>'; 
	console.log("Request Handlers for 'start' was called");
	res.writeHead(200,{"Content-Type":"text/html"});
	res.write(body);
	res.end();
}
function upload(res,postData){
	res.writeHead(200,{"Content-Type":"text/plain"});
	var temp_data = querystring.parse(postData).text;
	res.write(temp_data);
	res.end();
	console.log("Reques Handlers for 'upload ' was called");
}
exports.start = start;
exports.upload = upload;

这个页面里面,start函数首先向用户发送了一个网页,包含输入框和按钮,用户输入文字点击提交,数据被传入upload文件并显示。upload文件用于显示。



抱歉!评论已关闭.