发请求有两种方式，一种是用ajax，另一种是用form提交，默认的form提交如果不做处理的话，会使页面重定向。以一个简单的demo做说明：
html如下所示，请求的路径action为"upload"，其它的不做任何处理：
<form method="POST" action="upload" enctype="multipart/form-data"> 名字 <input type="text"></input> 头像 <input type="file"></input> <input type="submit" value="提交"></input> </form>
服务端(node)response直接返回: "Recieved form data"，演示如下：
可以看到默认情况下，form请求upload的同时重定向到upload。但是很多情况下是希望form请求像ajax一样，不会重定向或者刷新页面。像上面的场景，当上传完成之后，将用户选择的头像显示在当前页面。
解决办法第一种是使用html5的FormData，将form里面的数据封装到FormData对象里，然后再以POST的方式send出去。如下面代码所示，对提交按钮的单击事件做一个响应，代码第6行获取到form的DOM对象，然后第8行构造一个FormData的实例，第18行，将form数据发送出去。
document.getElementById("_submit").onclick = function(event){ //取消掉默认的form提交方式 if(event.preventDefault) event.preventDefault(); else event.returnValue = false; //对于IE的取消方式 var formDOM = document.getElementsByTagName("form")[]; //将form的DOM对象当作FormData的构造函数 var formData = new FormData(formDOM); var req = new XMLHttpRequest(); req.open("POST", "upload"); //请求完成 req.onload = function(){ if(this.status === ){ //对请求成功的处理 } } //将form数据发送出去 req.send(formData); //避免内存泄漏 req = null; }
上传成功后，服务将返回图片的访问地址，补充14行对请求成功的处理：在submit按钮的上方位置显示上传的图片：
var img = document.createElement("img"); img.src = JSON.parse(this.responseText).path; formDOM.insertBefore(img, document.getElementById("_submit"));
示例：
如果使用jQuery，可以把formData作为ajax的data参数，同时设置contentType: false和processData: false，告诉jQuery不要去处理请求头和发送的数据。
看起来这种提交方式跟ajax一样，但是其实并不是完全一样，form提交的数据格式有三种，如果要上传文件则必须为multipart/form-data，所以上面的form提交请求里的http的头信息里面的Content-Type为multipart/form-data，而普通的ajax提交为application/json。form提交完整的Content-Type如下：
"content-type":"multipart/form-data; boundary=------WebKitFormBoundaryYOE7pWLqdFYSeBFj"
除了multipart/form-data之外，还指定了boundary，这个boundary的作用是用来区分不同的字段。由于FormData对象是不透明的，调用JSON.stringify将会返回一个空的对象{}，同时FormData只提供append方法，所以无法得到FormData实际上传的内容，但是可以通过分析工具或者服务收到的数据进行查看。在上面如果上传一个文本文件，那么服务收到的POST数据的原始格式是这样的：
------WebKitFormBoundaryYOE7pWLqdFYSeBFj
Content-Disposition: form-data;
abc
------WebKitFormBoundaryYOE7pWLqdFYSeBFj
Content-Disposition: form-data;; filename="test.txt"
Content-Type: text/plain
这是一个文本文件的内容。
------WebKitFormBoundaryYOE7pWLqdFYSeBFj--
从上面服务收到的数据看出FormData提交的格式，每个字段以boundary隔开，最后以--结束。而ajax请求，send出去的数据格式是自定义的，一般都是以key=value中间用&连接：
var req = new XMLHttpRequest(); var sendData = "user=abc&file=这是一个文本文件的内内容"; req.open("POST", "upload"); //发送的数据需要转义，见上面提到的三种格式 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); req.send(sendData);
服务就会收到和send发出去的字符串一模一样的内容，然后再作参数解析，所以就得统一参数的格式：
user=abc&file=这是一个文本文件的内容
从这里可以看出POST本质上并不比GET安全，POST只是没有将数据放在网址传送而已。
考虑到FormData到了IE10才支持，如果要支持较低版本的IE，那么可以借助iframe。