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

今天按照《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文件用于显示。

时间: 2024-08-01 06:31:10

node.js学习(2)--路由功能以及表单上传的相关文章

js XMLHttpRequest + FormData 跨域提交表单上传文件

funUploadFile : function(file){ var self = this; // 在each中this指向没个v 所以先将this保留 var formdata = new FormData(); formdata.append("index", file.index); formdata.append("fileList", file); var xhr = new XMLHttpRequest(); if ("withCreden

[转]html5表单上传控件Files API

表单上传控件:<input type="file" />(IE9及以下不支持下面这些功能,其它浏览器最新版本均已支持.) 1.允许上传文件数量 允许选择多个文件:<input type="file" multiple> 只允许上传一个文件:<input  type="file" single> 2.上传指定的文件格式 <input type="file" accept="im

使用form表单上传文件

在使用form表单上传文件时候,input[type='file']是必然会用的,其中有一些小坑需要避免. 1.form的 enctype="multipart/form-data" 已经是个老生常谈的问题了,相信都能注意到,就不多说了. 2.上传下载的请求是不能用ajax提交返回json的. 3.当使用input[type='file'] 的onChange事件来触发文件上传的时候要注意当上传成功时清空input的时候,不能简单的使用$("input").val(

Android实现模拟表单上传

很久以前,写过一篇关于下载的文章:基于HTTP协议的下载功能实现,今天对于Android上的文件上传,也简单的提两笔.在Android上,一般使用Http 模拟表单或者FTP来进行文件上传,使用FTP协议,可以直接使用Appache的FTPClient,使用方法很简单,不再赘述.这里主要说明一下Http模拟表单上传的实现. 模拟表单上传,其实也很简单,主要需要在Http post 的数据体中构建表单信息(multipart/form),表单数据格式的规范,可以参考REC标准.下面是一个格式示例:

关于form表单上传文件的问题

最近在学习php,刚好学到利用表单上传文件这一知识.在学习的过程中,出现了这样几个问题,我是小白,还请高手指点. 大家都知道在上传文件时,我们要设置表单的MIME编码.默认情况,enctype的编码格:application/x-www-form-urlencoded,不能用于文件上传, 只有使用了multipart/form-data,才能完整的传递文件数据,进行下面的操作.但是我在接下来的操作中,遇到了这样的问题. <?php   if (isset($_POST['submit']) &

jq表单上传多文件 前后台代码

Html>>>>>>>>> <form id="Job_Notice_Form"  method="post" enctype="multipart/form-data"> <div id="f" > <div id="zhi"> <div style="display:none"> &

文件的上传(表单上传和ajax文件异步上传)

一.表单上传: html客户端部分: <form action="upload.ashx" method="post" enctype="multipart/form-data"> 选择文件:<input type="file" name="file1" /><br /> <input type="submit" value="上传&q

相册选择头像或者拍照 上传头像以NSData 图片二进制格式 表单上传

一.点击头像图片 或者按钮 在相册选择照片返回img,网络上传头像要用data表单上传 (1)上传头像属性 // 图片二进制格式 表单上传 @property (nonatomic, strong) NSData *imageWithData; (2)头像点击事件 - (void)headImageEvent{ NSLog(@"上传头像"); [self selectPhotoAlbumWithSelectPhotoHandle:^(UIImage *img) { self.heade

android form表单上传文件

原文地址:http://menuz.iteye.com/blog/1282097 Android程序使用http上传文件 有时,在网络编程过程中需要向服务器上传文件.Multipart/form-data是上传文件的一种方式. Multipart/form-data其实就是浏览器用表单上传文件的方式.最常见的情境是:在写邮件时,向邮件后添加附件,附件通常使用表单添加,也就是用multipart/form-data格式上传到服务器.  Html代码   <form action="/Test