HTTP請求與響應

一個很是完整的請求和響應demo

前端

發送報文主體、寫入cookie(自動隨帶)、發送自定義的頭部信息javascript

<body>
<div>
    <button id="btn">發送</button>
</div>
<script src="../js/lib/jquery-3.2.1.js"></script>
<script>
    document.cookie = "cookieKey=cookieValue";
    //ajax技術核心:XMLHttpRequest
    // 在不從新加載頁面的狀況下更新網頁
    // 在頁面已加載後從服務器請求數據
    // 在頁面已加載後從服務器接收數據
    // 在後臺向服務器發送數據
    $('#btn').click(function () {
        $.ajax({
            url: "postTest.do",
            type: "POST",
            dataType: "text",
            headers: {"aa":"this is my headerData"},
            contentType:"application/text;charset=UTF-8",
            data:"this is client request data",
            success: function(data,status,xmlhttp) {
                alert(data);
                alert(status);
                alert(xmlhttp.status);
                //響應實體的類型由 responseType 來指定, 能夠
                alert(xmlhttp.responseText);
                //打印全部的頭部信息
                alert(xmlhttp.getAllResponseHeaders());
                //按照key-value的形式取出響應的頭部信息
                alert(xmlhttp.getResponseHeader('Content-Type'));
                alert('token='+xmlhttp.getResponseHeader('token'));
            },
            error: function() {
                alert("請求出錯!");
            }
        });

    });

</script>
</body>

java後臺

接收有:解析頭部信息、主體信息、主體信息。並也返回這些信息。html

@RequestMapping(value="postTest.do",method= RequestMethod.POST,produces = "application/text;charset=UTF-8;")
    @ResponseBody
    public String postTest(HttpServletRequest request, HttpServletResponse response) throws IOException {
        //接收 cookie////////////////////////////////////////////////
        Cookie[] cookies = request.getCookies();
        System.out.println("Cookie長度:" + cookies.length);           //讀取本機共存在多少COOKIE
        if (cookies != null) {
            for (int i = 0; i < cookies.length; i++) {
                if (cookies[i].getName().equals("cookieKey")) {
                    System.out.println("cookie:cookieKey=" + URLDecoder.decode(cookies[i].getValue(),"UTF-8"));
                }
            }
        } else {
            System.out.println("沒有任何Cookie");
        }
        //接收 頭部信息
        System.out.println("頭部信息以下");
        System.out.println("request.getHeader(\"user-agent\") = :"+request.getHeader("user-agent"));
        System.out.println("request.getHeader(\"Referer\") = :"+request.getHeader("Referer"));
        System.out.println("request.getHeader(\"Accept\") = :"+request.getHeader("Accept"));
        System.out.println("request.getHeader(\"Host\"):"+request.getHeader("Host"));
        System.out.println("request.getHeader(\"aa\"):"+request.getHeader("aa"));
        //接收 客戶端的基本信息
        System.out.println("請求的基本信息以下");
        System.out.println("request.getRequestURL() = :"+request.getRequestURL());
        System.out.println("request.getRequestURI() = :"+request.getRequestURI());//可用於REST API構建!
        System.out.println("request.getRemoteHost() = :"+request.getRemoteHost());
        System.out.println("request.getRemotePort() = :"+request.getRemotePort());
        System.out.println("request.getLocalAddr() = :"+request.getLocalAddr());
        System.out.println("request.getLocalName() = :"+request.getLocalName());
        System.out.println("request.getMethod() = :"+request.getMethod());
        System.out.println("解析HTTP POST方式的報文主體以下:");
        //接收報文主體數據
        DataInputStream in = new DataInputStream(request.getInputStream());
        int totalBytes = request.getContentLength();
        byte[] b = new byte[totalBytes];
        in.readFully(b);
        in.close();
        String reqContent = new String(b, "UTF-8");
        System.out.println("request.getInputStream()解析的報文主體 = "+reqContent);

        //返回cookie////////////////////////////////////////////////
        //建立一個cookie
        Cookie cookie = new Cookie("key1", "cookieValue1");
        cookie.setPath("/");// 這個要設置
        // cookie.setDomain(".zhangsan.com");//這樣設置,能實現兩個網站共用
        cookie.setMaxAge(365 * 24 * 60 * 60);// 不設置的話,則cookies不寫入硬盤,而是寫在內存,只在當前頁面有用,以秒爲單位,關閉瀏覽器就沒了
        response.addCookie(cookie);         //添加cookie到響應對象中
        //建立第二個cookie
        cookie = new Cookie("key2", "cookieValue2");
        cookie.setPath("/");
        cookie.setMaxAge(365 * 24 * 60 * 60);
        response.addCookie(cookie);         //添加cookie到響應對象中
        //刪除一個cookie:添加第三個Cookie 用這個cookie來毀掉以前的那個cookie 達到刪除的效果!
        cookie = new Cookie("username","");//這邊得用"",不能用null
        cookie.setPath("/");//設置成跟寫入cookies同樣的
        cookie.setMaxAge(0);
        response.addCookie(cookie);
        //添加到HTTP頭部信息:讓頭部攜帶token信息!
        response.setHeader("token","bb999888");
        //返回響應報文主體數據!
        return "來自後臺的數據!";
    }

結果輸出

Cookie長度:5
cookie:cookieKey=cookieValue
頭部信息以下
request.getHeader("user-agent") = :Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:60.0) Gecko/20100101 Firefox/60.0
request.getHeader("Referer") = :http://localhost:8080/
request.getHeader("Accept") = :text/plain, */*; q=0.01
request.getHeader("Host"):localhost:8080
request.getHeader("aa"):this is my headerData
請求的基本信息以下
request.getRequestURL() = :http://localhost:8080/postTest.do
request.getRequestURI() = :/postTest.do
request.getRemoteHost() = :0:0:0:0:0:0:0:1
request.getRemotePort() = :50403
request.getLocalAddr() = :0:0:0:0:0:0:0:1
request.getLocalName() = :localhost
request.getMethod() = :POST
解析HTTP POST方式的報文主體以下:
request.getInputStream()解析的報文主體 = this is client request data

 

 

 

1. $.ajax()發送請求帶上頭部信息前端

$('#btn').click(function () {
        var inVal =  $('#inVal').val();
        $.ajax({
            url: "postTest.do",
            headers:{"appId":"123","appKey":"456"},
            type: "POST",
            dataType: "text",
            contentType:"application/text;charset=UTF-8",
            data:inVal,
            success: function(data) {
                alert(data);
            },
            error: function() {
                alert("請求出錯!");
            }
        });

    });

2. 接收頭部信息並返回接收的主體信息java

@RequestMapping(value="postTest.do",method= RequestMethod.POST,produces = "application/text;charset=UTF-8;")
    @ResponseBody
    public String postTest2(@RequestBody String data,@RequestHeader("appId") String appId){
        System.out.println("\n\ndata = :"+data);
        System.out.println("\n\nappId = :"+appId);
        return data;
    }

基於$.ajax()提交

1、解析POST請求(內容放在HTTP報文主體中)

$.ajax POST請求

$.ajax({
            url: "postTest.do?",
            type: "POST",
            dataType: "text",
            contentType:"application/text;charset=UTF-8",
            data: {"key1":"val1","key2":"val2"},
            success: function(data) {
                alert(data);
            },
            error: function() {
                alert("請求出錯!");
            }
        });

java後臺代碼:

主要經過request.getInputStream()來接收HTTP報文主體內容!jquery

@RequestMapping(value="postTest.do",method= RequestMethod.POST,produces = "application/text;charset=UTF-8;")
    @ResponseBody
    public String postTest(HttpServletRequest request) throws IOException {
        System.out.println("請求的基本信息以下");
        System.out.println("request.getRequestURL() = :"+request.getRequestURL());
        System.out.println("request.getRequestURI() = :"+request.getRequestURI());//可用於REST API構建!
        System.out.println("request.getRemoteHost() = :"+request.getRemoteHost());
        System.out.println("request.getRemotePort() = :"+request.getRemotePort());
        System.out.println("request.getLocalAddr() = :"+request.getLocalAddr());
        System.out.println("request.getLocalName() = :"+request.getLocalName());
        System.out.println("request.getMethod() = :"+request.getMethod());
        System.out.println("解析HTTP POST方式的報文主體以下:");
        System.out.println("request.getParameter(\"aa\") = :"+request.getParameter("aa"));
        DataInputStream in = new DataInputStream(request.getInputStream());
        int totalBytes = request.getContentLength();
        byte[] b = new byte[totalBytes];
        in.readFully(b);
        in.close();
        String reqContent = new String(b, "UTF-8");
        System.out.println("request.getInputStream()解析的報文主體 = "+reqContent);
        System.out.println("頭部信息以下");
        System.out.println("request.getHeader(\"user-agent\") = :"+request.getHeader("user-agent"));
        System.out.println("request.getHeader(\"Referer\") = :"+request.getHeader("Referer"));
        System.out.println("request.getHeader(\"Accept\") = :"+request.getHeader("Accept"));
        System.out.println("request.getHeader(\"Host\"):"+request.getHeader("Host"));
        return "來自後臺的數據!";
    }

打印輸出以下:

請求的基本信息以下
request.getRequestURL() = :http://localhost:8080/postTest.do
request.getRequestURI() = :/postTest.do
request.getRemoteHost() = :0:0:0:0:0:0:0:1
request.getRemotePort() = :55300
request.getLocalAddr() = :0:0:0:0:0:0:0:1
request.getLocalName() = :localhost
request.getMethod() = :POST
解析HTTP POST方式的報文主體以下:
request.getParameter("aa") = :null
request.getInputStream()解析的報文主體 = key1=val1&key2=val2
頭部信息以下
request.getHeader("user-agent") = :Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:60.0) Gecko/20100101 Firefox/60.0
request.getHeader("Referer") = :http://localhost:8080/
request.getHeader("Accept") = :text/plain, */*; q=0.01
request.getHeader("Host"):localhost:8080

2、解析GET請求參數(放在HTTP URL上)

$.ajax GET請求

$.ajax({
            url: "postTest.do?",
            type: "GET",
            dataType: "text",
            contentType:"application/text;charset=UTF-8",
            data: {"key1":"val1","key2":"val2"},
            success: function(data) {
                alert(data);
            },
            error: function() {
                alert("請求出錯!");
            }
        });

java後臺代碼:

主要經過request.getQueryString()來接收HTTP的參數列表(放在URL部分)!web

@RequestMapping(value="postTest.do",method= RequestMethod.GET,produces = "application/text;charset=UTF-8;")
    @ResponseBody
    public String postTest(HttpServletRequest request) throws IOException {
        System.out.println("GET請求的參數數據");
        System.out.println("\nrequest.getQueryString() = :"+request.getQueryString());
        System.out.println("請求的基本信息以下");
        System.out.println("request.getRequestURL() = :"+request.getRequestURL());
        System.out.println("request.getRequestURI() = :"+request.getRequestURI());//可用於REST API構建!
        System.out.println("request.getRemoteHost() = :"+request.getRemoteHost());
        System.out.println("request.getRemotePort() = :"+request.getRemotePort());
        System.out.println("request.getLocalAddr() = :"+request.getLocalAddr());
        System.out.println("request.getLocalName() = :"+request.getLocalName());
        System.out.println("request.getMethod() = :"+request.getMethod());
        System.out.println("頭部信息以下");
        System.out.println("request.getHeader(\"user-agent\") = :"+request.getHeader("user-agent"));
        System.out.println("request.getHeader(\"Referer\") = :"+request.getHeader("Referer"));
        System.out.println("request.getHeader(\"Accept\") = :"+request.getHeader("Accept"));
        System.out.println("request.getHeader(\"Host\"):"+request.getHeader("Host"));
        return "來自後臺的數據!";
    }

打印輸出

GET請求的參數數據

request.getQueryString() = :&key1=val1&key2=val2
請求的基本信息以下
request.getRequestURL() = :http://localhost:8080/postTest.do
request.getRequestURI() = :/postTest.do
request.getRemoteHost() = :0:0:0:0:0:0:0:1
request.getRemotePort() = :56121
request.getLocalAddr() = :0:0:0:0:0:0:0:1
request.getLocalName() = :localhost
request.getMethod() = :GET
頭部信息以下
request.getHeader("user-agent") = :Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:60.0) Gecko/20100101 Firefox/60.0
request.getHeader("Referer") = :http://localhost:8080/
request.getHeader("Accept") = :text/plain, */*; q=0.01
request.getHeader("Host"):localhost:8080

基於Form提交的處理

普通表單提交

HTML

<form action="postTest.do" method="GET" accept-charset="UTF-8">
        <p>First name: <input type="text" name="userName" /></p>
        <p>Last name: <input type="text" name="passWord" /></p>
        <input type="submit" value="提交表單" />
    </form>

java後臺:

request.getParameter()都可接收POST和GET請求的表單數據,均可以用request.getParameter("passWord"));方法來解析表單數據!ajax

request.getQueryString()不可用於POST請求。spring

@RequestMapping(value="postTest.do",method= RequestMethod.GET,produces = "application/text;charset=UTF-8;")
    @ResponseBody
    public String postTest(HttpServletRequest request) throws IOException {
        System.out.println("POST請求的參數數據");
        String str = "";
        String reqMethod = request.getMethod();
        if(reqMethod.equals("GET"))
            str = request.getQueryString();
        else//POST
            str = request.getParameter("userName");
        String  cs= URLDecoder.decode(str,"utf-8");//將中文轉碼
        System.out.println("userName = :"+cs);
        System.out.println("passWord = :"+request.getParameter("passWord"));
        System.out.println("請求的基本信息以下");
        System.out.println("request.getRequestURL() = :"+request.getRequestURL());
        System.out.println("request.getRequestURI() = :"+request.getRequestURI());//可用於REST API構建!
        System.out.println("request.getRemoteHost() = :"+request.getRemoteHost());
        System.out.println("request.getRemotePort() = :"+request.getRemotePort());
        System.out.println("request.getLocalAddr() = :"+request.getLocalAddr());
        System.out.println("request.getLocalName() = :"+request.getLocalName());
        System.out.println("request.getMethod() = :"+request.getMethod());
        System.out.println("頭部信息以下");
        System.out.println("request.getHeader(\"user-agent\") = :"+request.getHeader("user-agent"));
        System.out.println("request.getHeader(\"Referer\") = :"+request.getHeader("Referer"));
        System.out.println("request.getHeader(\"Accept\") = :"+request.getHeader("Accept"));
        System.out.println("request.getHeader(\"Host\"):"+request.getHeader("Host"));
        return "來自後臺的數據!";
    }

打印

POST請求的參數數據
userName = :userName=張三&passWord=123456
passWord = :123456
請求的基本信息以下
request.getRequestURL() = :http://localhost:8080/postTest.do
request.getRequestURI() = :/postTest.do
request.getRemoteHost() = :0:0:0:0:0:0:0:1
request.getRemotePort() = :60414
request.getLocalAddr() = :0:0:0:0:0:0:0:1
request.getLocalName() = :localhost
request.getMethod() = :GET
頭部信息以下
request.getHeader("user-agent") = :Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:60.0) Gecko/20100101 Firefox/60.0
request.getHeader("Referer") = :http://localhost:8080/
request.getHeader("Accept") = :text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
request.getHeader("Host"):localhost:8080

上傳文件的表單提交:

添加依賴(同時須要兩個依賴!)

<!--上傳文件-->
    <dependency>
      <groupId>commons-fileupload</groupId>
      <artifactId>commons-fileupload</artifactId>
      <version>1.3.2</version>
    </dependency>
      <dependency>
          <groupId>commons-net</groupId>
          <artifactId>commons-net</artifactId>
          <version>1.4.1</version>
      </dependency>

配置:在bean的配置文件中添加!

<!--上傳文件-->
    <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <property name="maxUploadSize" value="1000000"></property>
    </bean>

HTML幾個必須

a. enctype="multipart/form-data瀏覽器

b. 必須爲POST請求:method="POST"服務器

<form enctype="multipart/form-data" action="postTest.do" method="POST" accept-charset="UTF-8">
        <input type="file" name="file">
        <input type="submit" value="上傳" />
    </form>

java接收:一個必須

必需要MultipartFile類對象來接收!

@RequestMapping(value="postTest.do",method= RequestMethod.POST,produces = "application/text;charset=UTF-8;")
    @ResponseBody
    public String postTest(@RequestParam("file") MultipartFile file) {
        System.out.println("\n\n fileName = :"+file.getOriginalFilename());
        return "來自後臺的數據!";
    }

基於$.ajax的接收並解析響應

js

$('#btn').click(function () {
        $.ajax({
            url: "postTest.do",
            type: "POST",
            dataType: "text",
            contentType:"application/text;charset=UTF-8",
            success: function(data,status,xmlhttp) {
                alert(data);
                alert(status);
                alert(xmlhttp.status);
                //響應實體的類型由 responseType 來指定, 能夠
                alert(xmlhttp.responseText);
                //打印全部的頭部信息
                alert(xmlhttp.getAllResponseHeaders());
                //按照key-value的形式取出響應的頭部信息
                alert(xmlhttp.getResponseHeader('Content-Type'));
                alert('token='+xmlhttp.getResponseHeader('token'));
            },
            error: function() {
                alert("請求出錯!");
            }
        });

    });

java(並寫入token在響應HTTP的頭部)

@RequestMapping(value="postTest.do",method= RequestMethod.POST,produces = "application/text;charset=UTF-8;")
    @ResponseBody
    public String postTest(HttpServletRequest request, HttpServletResponse response){
        response.setHeader("token","bb999888");
        return "來自後臺的數據!";
    }

帶上cookie

@RequestMapping(value="postTest.do",method= RequestMethod.POST,produces = "application/text;charset=UTF-8;")
    @ResponseBody
    public String postTest(HttpServletRequest request, HttpServletResponse response) throws IOException {
        Cookie[] cookies = request.getCookies();
        System.out.println("Cookie長度:" + cookies.length);           //讀取本機共存在多少COOKIE
        if (cookies != null) {
            for (int i = 0; i < cookies.length; i++) {
                if (cookies[i].getName().equals("username")) {
                    System.out.println("cookie:username=" + URLDecoder.decode(cookies[i].getValue(),"UTF-8"));
                }
            }
        } else {
            System.out.println("沒有任何Cookie");
        }

        //建立一個cookie
        Cookie cookie = new Cookie("key1", "cookieValue1");
        cookie.setPath("/");// 這個要設置
        // cookie.setDomain(".zhangsan.com");//這樣設置,能實現兩個網站共用
        cookie.setMaxAge(365 * 24 * 60 * 60);// 不設置的話,則cookies不寫入硬盤,而是寫在內存,只在當前頁面有用,以秒爲單位,關閉瀏覽器就沒了
        response.addCookie(cookie);         //添加cookie到響應對象中
        //建立第二個cookie
        cookie = new Cookie("key2", "cookieValue2");
        cookie.setPath("/");
        cookie.setMaxAge(365 * 24 * 60 * 60);
        response.addCookie(cookie);         //添加cookie到響應對象中
        //刪除一個cookie:添加第三個Cookie 用這個cookie來毀掉以前的那個cookie 達到刪除的效果!
        cookie = new Cookie("username","");//這邊得用"",不能用null
        cookie.setPath("/");//設置成跟寫入cookies同樣的
        cookie.setMaxAge(0);
        response.addCookie(cookie);
        return "來自後臺的數據!";
    }
相關文章
相關標籤/搜索