HTTP权威指南阅读笔记三:HTTP报文

  报文的组成部分

  报文由三部分组成:对报文进行描述的起始行(start line)、包含属性的首部(header),以及可选的、包含数据的主体(body)部分。

 

  请求报文格式

  <method> <request-URL> <version>

  <headers>

  <entity-body>

 

  响应报文格式

  <version> <status> <reson-phrase>

  <headers>

  <entity-body>

 

  HTTP方法

  主要的HTTP方法有:

方法 描述 是否包含主体
GET 从服务器获取一份文档
HEAD 只从服务器获取文档的首部
POST 向服务器发送需要处理的数据
PUT 将请求的主体部分存储在服务器上
TRACE 对可能经过代理服务器传送到服务器上去的报文进行追踪
OPTIONS 决定可以在服务器上执行哪些方法
DELETE 从服务器上删除一份文档

  另外,HTTP1.1允许扩展规范中没有的方法。

 

  示例

  js部分:

var httpMethodTest = (function () {
    "use strict";

    var _xhr = new XMLHttpRequest();

    var _sendXHR = function (method, url, callback) {
        _xhr.onreadystatechange = function () {
            if (_xhr.readyState === 4 && _xhr.status === 200) {
                callback(_xhr);
            }
        };

        _xhr.open(method, url, true);
        _xhr.send('');
    };


    var get = function (url, callback) {
        _sendXHR("GET", url, callback);
    };

    var put = function (url, callback) {
        _sendXHR("PUT", url, callback);
    };

    var post = function (url, callback) {
        _sendXHR("POST", url, callback);
    };

    var head = function (url, callback) {
        _sendXHR("HEAD", url, callback);
    };

    var trace = function (url, callback) {
        _sendXHR("TRACE", url, callback);
    };

    var options = function (url, callback) {
        _sendXHR("OPTIONS", url, callback);
    };

    var deleteMethod = function (url, callback) {
    };

    return {
        get: get,
        put: put,
        post: post,
        head: head,
        trace: trace,
        options: options,
        deleteMethod: deleteMethod
    };
})();


var btnGET = document.getElementById("btnGET"),
    btnPOST = document.getElementById("btnPOST"),
    btnPUT = document.getElementById("btnPUT"),
    btnHEAD = document.getElementById("btnHEAD"),
    btnOPTIONS = document.getElementById("btnOPTIONS"),
    btnTRACE = document.getElementById("btnTRACE"),
    headerResultNode = document.getElementById("headerResult"),
    bodyResultNode = document.getElementById("bodyResult"),
    headerTitleNode = document.getElementById("headerTitle"),
    bodyTitleNode = document.getElementById("bodyTitle");
btnGET.onclick = function () {
    headerTitleNode.innerHTML = "GET Response Headers:";
    bodyTitleNode.innerHTML = "GET Response Body:";
    httpMethodTest.get("/home/Test?t=" + Math.random(), methodResult);
}

btnPOST.onclick = function () {
    headerTitleNode.innerHTML = "POST Response Headers:";
    bodyTitleNode.innerHTML = "POST Response Body:";
    httpMethodTest.post("/home/Test?t=" + Math.random(), methodResult);
}

btnPUT.onclick = function () {
    headerTitleNode.innerHTML = "PUT Response Headers:";
    bodyTitleNode.innerHTML = "PUT Response Body:";
    httpMethodTest.put("/home/Test?t=" + Math.random(), methodResult);
}

btnHEAD.onclick = function () {
    headerTitleNode.innerHTML = "HEAD Response Headers:";
    bodyTitleNode.innerHTML = "HEAD Response Body:";
    httpMethodTest.head("/home/Test?t=" + Math.random(), methodResult);
}

//由于ajax中不可以直接发trace请求,所以这里改为发get请求,然后在controller中作代理发trace请求
btnTRACE.onclick = function () {
    headerTitleNode.innerHTML = "TRACE Response Headers:";
    bodyTitleNode.innerHTML = "TRACE Response Body:";
    httpMethodTest.get("/home/Trace?url=" + encodeURIComponent("http://xxxxx/test.php") + "&t" + Math.random(), methodResult);
}

btnOPTIONS.onclick = function () {
    headerTitleNode.innerHTML = "OPTIONS Response Headers:";
    bodyTitleNode.innerHTML = "OPTIONS Response Body:";
    httpMethodTest.options("/home/Test?t=" + Math.random(), methodResult);
}

//从XMLHttpRequest中取出Header及Body数据
function methodResult(xhr) {
    var header = {},
        response = "",
        results = [];
    header["status"] = xhr.status;
    header["statusText"] = xhr.statusText;
    header["Cache-Control"] = xhr.getResponseHeader("Cache-Control");
    header["Content-Type"] = xhr.getResponseHeader("Content-Type");
    header["Allow"] = xhr.getResponseHeader("Allow");
    header["Content-Encoding"] = xhr.getResponseHeader("Content-Encoding");
    header["Vary"] = xhr.getResponseHeader("Vary");
    header["Server"] = xhr.getResponseHeader("Server");
    header["Date"] = xhr.getResponseHeader("Date");
    header["Content-Length"] = xhr.getResponseHeader("Content-Length");
    for (var key in header) {
        if (header[key]) {
            results.push("<li>" + key + ": " + header[key] + "</li>");
        }
    }
    headerResultNode.innerHTML = results.join("");
    bodyResultNode.value = xhr.responseText;
}

  页面部分:

<div>
    <input type="button" id="btnGET" value="GET" />
    <input type="button" id="btnPOST" value="POST" />
    <input type="button" id="btnPUT" value="PUT" />
    <input type="button" id="btnHEAD" value="HEAD" />
    <input type="button" id="btnTRACE" value="TRACE" />
    <input type="button" id="btnOPTIONS" value="OPTIONS" />
</div>
<h3 id="headerTitle">Response Headers:</h3>
<ul id="headerResult" class="list-txt">

</ul>
<h3 id="bodyTitle">Response Body:</h3>
<textarea id="bodyResult" class="list-txt" rows="5" disabled="disabled"></textarea>

  controller中发送trace请求: 

public void Test()
{
    Response.ClearContent();
    if (Request.HttpMethod.Equals("OPTIONS"))
    {
        Response.AddHeader("Allow", "GET, POST, PUT, DELETE, TRACE, OPTIONS");
    }
    else
    {
        Response.Write("This is a " + Request.HttpMethod);
    }
    Response.End();
}

public void Trace(string url)
{
    HttpWebRequest httpWReq = (HttpWebRequest)WebRequest.Create(url);

    httpWReq.Method = "TRACE";
    httpWReq.ContentType = "application/x-www-form-urlencoded";

    HttpWebResponse response = (HttpWebResponse)httpWReq.GetResponse();

    string responseString = new StreamReader(response.GetResponseStream()).ReadToEnd();
    Response.ClearContent();
    Response.Write(responseString);
    Response.End();
}

  运行结果:

  get/put/post的header及body类似,也很常见,这里就不帖图了

  

HEAD

 

TRACE

 

OPTIONS

版权

作者:Artwl

出处:http://artwl.cnblogs.com

本文首发博客园,版权归作者跟博客园共有。转载必须保留本段声明,并在页面显著位置给出本文链接,否则保留追究法律责任的权利。

posted @ 2013-09-24 17:49  artwl  阅读(1032)  评论(0编辑  收藏  举报

个人简介

var ME = {
	"name": "土豆/Artwl",
	"job": "coding",
	"languages": [
		"JS", "HTML",
                "CSS", "jQuery"
		"MVC",".NET",
		"设计模式"
	],
	"hobby": [
		"阅读", "旅游",
		"音乐", "电影"
	]
}
TOP