HTTP协议之multipart/form-data请求分析

首先来了解什么是multipart/form-data请求：

根据http/1.1 rfc 2616的协议规定，我们的请求方式只有OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE等，那为为何我们还会有multipart/form-data请求之说呢？这就要从头来说了。

http协议大家都知道是规定了以ASCII码传输，建立在tcp、ip协议之上的应用层规范，规范内容把http请求分为3个部门：状态行，请求 头，请求体。所有的方法、实现都是围绕如何运用和组织这三部分来完成的。换句话来说就是万变不离其中，只要我们了解了http请求的组成部分后，自然就可 以应变任何实际工作中的需求和问题了。

关于状态行，请求头，请求体等三部分的具体内容，大家可以参考官方的协议文档http://www.faqs.org/rfcs/rfc2616.html，这里主要分析multipart/form-data请求具体是怎么一回事。

既然http协议本身的原始方法不支持multipart/form-data请求，那这个请求自然就是由这些原始的方法演变而来的，具体如何演变且看下文：

1、multipart/form-data的基础方法是post，也就是说是由post方法来组合实现的

2、multipart/form-data与post方法的不同之处：请求头，请求体。

3、multipart/form-data的请求头必须包含一个特殊的头信息：Content-Type，且其值也必须规定为multipart /form-data，同时不锈钢转子泵还需要规定一个内容分割符用于分割请求体中的多个post的内容，如文件内容和文本内容自然需要分割开来，不然接收方就无法正
常解析和还原这个文件了。具体的头信息如下：

1

    

Content-Type: multipart/form-data; boundary=${bound}

//其中${bound} 是一个占位符，代表我们规定的分割符，可以自己任意规定，但为了避免和正常文本重复了，尽量要使用复杂一点的不锈钢转子泵内容。如：--------------------56423498738365

4、multipart/form-data的请求体也是一个字符串，不过和post的请求体不同的是它的构造方式，post是简单的name=value值连接，而multipart/form-data则是添加了分隔符等内容的构造体。具体格式如下:

    

--${bound}

Content-Disposition: form-data; name="Filename"

   

HTTP.pdf

--${bound}

Content-Disposition: form-data; name="file000"; filename="HTTP协议详解.pdf"

Content-Type: application/octet-stream

   

%PDF-1.5

file content

%%EOF

   

--${bound}

Content-Disposition: form-data; name="Upload"

   

Submit Query

--${bound}--

尝试用jQuery控制HTML5视频，两个视频分别在两个tab中，我希望点中tab后，该tab里的视频可以立即播放，而另外tab里的视频能够停止。

我的代码是这样的：

    

$('#playMovie1').click(function(){

$('#movie1').play();

});http://www.swufe.edu.cn/

但发现这样不行，而用以下的js是可以的：

    

document.getElementById('movie1').play();

解决方法：

play并不是jQuery的函数，而是DOM元素的函数，所以我们需要通过DOM来调用play，代码如下：

    

$('#videoId').get(0).play();

最简单的方法实现Play和Pause:

    

$('video').trigger('play');

$('video').trigger('pause');

点击视频就能播放和暂停

    

$("video").trigger("play");//for auto play

$("video").addClass('pause');//for check pause or play add a class

$('video').click(function() {

if ($(this).hasClass('pause')) {

$("video").trigger("play");

$(this).removeClass('pause');

$(this).addClass('play');

} else {

$("video").trigger("pause");

$(this).removeClass('play');

$(this).addClass('pause');

}

})