學會Response回應，吃透這篇足夠-有解無憂

前言

該技術博客是我的學習筆記，自我總結并非復制粘貼，取自黑馬JavaWeb視頻，

想要看Request方面的技術博客可以訪問我的技術博客網址：

吃透Response回應，吃透這篇足夠

一、Response功能介紹

功能：設定回應訊息
	1.設定回應行
		1.格式：HTTP/1.1 200 ok
		2.設定狀態碼：setStatus(int sc)
	2.設定回應頭：setHeader(String name,String value)
	
	3.設定回應體：
		使用步驟：
			1.獲取輸出流
				字符輸出流：PrintWriter getWriter()
				位元組輸出流：ServletOutputStream getOutputStream()
			2.使用輸出流，將資料輸出到客戶端瀏覽器中

二、案例步驟：

1.完成重定向
	重定向：資源跳轉的方式
	代碼實作：
        //1.設定狀態碼為302
        response.setStatus(302);
        //2.設定回應頭location
        response.setHeader("location","/day15/responseDemo2");

        //簡單的重定向方法
        response.sendRedirect("/day15/responseDemo2");
     
    重定向的特點：redirect
    	1.地址欄發生變化
    	2.重定向可以訪問其他站點（服務器）的資源
    	3.重定向是兩次請求，不能使用request物件來共享資料
    轉發的特點：forward
    	1.轉發地址欄路徑不變
    	2.轉發只能訪問當前服務器下的資源
    	3.轉發是一次請求，可以使用request物件共享資料
    路徑寫法:
    	1.路徑分類
    		1.相對路徑：通過相對路徑不可以確定唯一資源
    			如：./index.html
    			不以/開頭，以.開頭的路徑
    			
				規則：確定訪問的當前資源和目標資源之間的相對位置關系
					./：表示當前目錄
					../：后退一級目錄
    		2.絕對路徑：通過絕對路徑可以確定唯一資源
    			如：http://localhost/day15/responseDemo2
    			以/開頭的路徑

				規則：判斷定義的路徑是給誰用的？判斷請求將來從哪發出
					給客戶端瀏覽器使用：需要加虛擬目錄（專案的訪問路徑）
						介意虛擬目錄動態獲取：request.getContextPath()
					給服務器使用：不需要加虛擬目錄
						轉發路徑
    
2.服務器輸出字符資料到瀏覽器
	步驟：
		1.獲取字符輸出流
		2.輸出資料
	注意：
		亂碼問題：
			1.PrintWriter pw = response.getWriter();獲取的流的默認編碼是ISO-88859-1
			2.設定該的默認編碼
			3.告訴瀏覽器回應體使用的編碼
		
		//簡單的形式，設定編碼，是在獲取流之前設定
		response.setContentType("text/html;Charset=utf-8");

3.服務器輸出位元組資料到瀏覽器	
	步驟：
  		1.獲取位元組輸出流
		2.輸出資料
 
4.驗證碼
	1.本質：圖片
	2.目的：放置惡意表單注冊

三、案例1：重定向代碼實作

重定向圖解：紅線表示的就是重定向
在這里插入圖片描述 代碼實作：

package cn.itcast.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

/**
 * 完成重定向
 */
@WebServlet("/responseDemo1")
public class ResponseDemo1 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        System.out.println("demo1........");


        /*//訪問/responseDemo1資源，會自動跳轉到/responseDemo2資源
        //1.設定狀態碼為302
        response.setStatus(302);
        //2.設定回應頭location
        response.setHeader("location","/day15/responseDemo2");*/

        //簡單的重定向方法
        response.sendRedirect("/day15/responseDemo2");
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

=========================================================================================
package cn.itcast.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet("/responseDemo2")
public class ResponseDemo2 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        System.out.println("demo2......");
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

四、案例2：輸出字符資料

不墨跡，直接看代碼：

package cn.itcast.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;

@WebServlet("/responseDemo4")
public class ResponseDemo4 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1.獲取字符輸出流
        PrintWriter pw = response.getWriter();
        //2.輸出資料
        pw.write("<h1>hello response</h1>");
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

debug方式啟動后，直接在頁面上顯示：

在這里插入圖片描述很明顯，輸出字符資料真的非常的簡單，

接下來講一個比較麻煩的事：中文亂碼的問題
因為我們輸出的資料在所難免會遇到中文的資料，代碼如下：

//2.輸出資料
pw.write("你好，response");

這樣就會出現亂碼情況：

在這里插入圖片描述那么接下來我們分析一下亂碼的原因：無外乎就是編碼和解碼的碼表不一致，
如上圖所示：
瀏覽器打開默認的字符集跟當前作業系統的語言和環境有關系，我們現在用的windows作業系統默認的字符集編碼表是GBK（gb2312）
服務器用的不是GBK，否則不會亂碼，

字符輸出流的編碼是ISO的，該編碼被GBK解碼一定會亂碼，
找到原因之后，解決這個亂碼就會變得很簡單：我們可以設定流的編碼是GBK就可以了，

package cn.itcast.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;

@WebServlet("/responseDemo4")
public class ResponseDemo4 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //獲取流物件之前去設定流的默認編碼：ISO-8859-1 設定為:GBK
        response.setCharacterEncoding("GBK");
        //1.獲取字符輸出流
        PrintWriter pw = response.getWriter();
        //2.輸出資料
        pw.write("你好，response");
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

設定完流的默認編碼后重繪一下服務器就發現，可以識別中文了：
在這里插入圖片描述
但是僅僅是一種巧合，為什么？
因為我們明確的知道客戶端用的是GBK才可以這樣設定，將來有的瀏覽器就是utf-8,就意味著設定GBK不好使，
我們還需要告訴瀏覽器，服務器發送的訊息體資料的編碼，建議瀏覽器使用該編碼解碼，如何完成代碼如下：

package cn.itcast.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
import java.nio.charset.Charset;

@WebServlet("/responseDemo4")
public class ResponseDemo4 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //獲取流物件之前去設定流的默認編碼：ISO-8859-1 設定為:GBK
        //response.setCharacterEncoding("utf-8");
        //告訴瀏覽器，服務器發送的訊息體資料的編碼，建議瀏覽器使用該編碼解碼
        response.setHeader("content-type","text/html;Charset=utf-8");
        //1.獲取字符輸出流
        PrintWriter pw = response.getWriter();
        //2.輸出資料
        pw.write("你好，response");
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

但是這段代碼寫起來還是挺麻煩的，因為頭資訊是固定的，也就是說每一次都要寫這行代碼，所以response物件給我們提供的一個簡單的型式來設定編碼：

package cn.itcast.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
import java.nio.charset.Charset;

@WebServlet("/responseDemo4")
public class ResponseDemo4 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //獲取流物件之前去設定流的默認編碼：ISO-8859-1 設定為:GBK
        response.setCharacterEncoding("utf-8");
        //告訴瀏覽器，服務器發送的訊息體資料的編碼，建議瀏覽器使用該編碼解碼
        //response.setHeader("content-type","text/html;Charset=utf-8");
        //簡單的形式，設定編碼
        response.setContentType("text/html;Charset=utf-8");
        //1.獲取字符輸出流
        PrintWriter pw = response.getWriter();
        //2.輸出資料
        pw.write("你好啊啊啊啊，response");
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

以后我們要記住，在獲取字符輸出流并且寫中文資料之前，就要把這行代碼寫到最前面:

response.setContentType("text/html;Charset=utf-8");

五、案例3：輸出位元組資料

接下來說，輸出位元組資料，代碼如下：

package cn.itcast.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet("/responseDemo5")
public class ResponseDemo5 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1.獲取位元組輸出流
        ServletOutputStream sos = response.getOutputStream();
        //2.輸出資料
        sos.write("hello".getBytes());
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

hello就被訪問到了：
在這里插入圖片描述
當我們想輸出中文，并且設定的是utf-8就會亂碼：

//2.輸出資料
sos.write("你好".getBytes("utf-8"));

解決方式：

response.setHeader("content-type","text/html;Charset=utf-8");

六、案例4：驗證碼

創建驗證碼步驟非常簡單，我們直接代碼演示：

package cn.itcast.web.servlet;

import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.nio.Buffer;
import java.security.DigestOutputStream;
import java.util.Random;

@WebServlet("/checkCodeServlet")
public class CheckCodeServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        int width = 100;
        int height = 50;
        // 1.創建一個物件，在記憶體中畫圖(驗證碼圖片物件)
        BufferedImage image = new BufferedImage(width,height, BufferedImage.TYPE_INT_RGB);
        // 2.美化圖片
        // 2.1填充背景色
        Graphics g = image.getGraphics(); // 獲取畫筆物件
        g.setColor(Color.pink);
        g.fillRect(0,0,width,height);

        // 2.2畫邊框
        g.setColor(Color.blue);
        g.drawRect(0,0,width - 1,height - 1);

        String str = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

        // 生成隨機角標
        Random ran = new Random();

        for (int i = 1; i <= 4; i++) {
            int index = ran.nextInt(str.length());
            // 獲取字符
            char ch = str.charAt(index); // 隨機字符
            // 2.3寫驗證碼
            g.drawString(ch + "" ,width / 5 * i,height / 2);
        }

        // 2.4畫干擾線
        g.setColor(Color.green);

        // 隨機生成坐標點
        for (int i = 0; i < 10; i++) {
            int x1 = ran.nextInt(width);
            int x2 = ran.nextInt(width);

            int y1 = ran.nextInt(height);
            int y2 = ran.nextInt(height);
            g.drawLine(x1,y1,x2,y2);
        }
        
        // 3.將圖片輸出到頁面展示
        ImageIO.write(image,"jpg",response.getOutputStream());
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

代碼效果如下，重新加載會呈現不同的驗證碼：

在這里插入圖片描述學習完了使用代碼的方式來實作驗證碼，接下來，說一下真正將來在程式開發程序中如何使用驗證碼，當然不是在頁面上顯示一個驗證碼，是配合注冊表單一起來顯示驗證碼，（只能是一張圖片）

接下來說一下驗證碼切換效果：
我們寫一個HTML頁面，代碼如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        /*
            分析：
                點擊超鏈接或者圖片，需要換一張
                1.給超鏈接和圖片系結單擊事件
                2.重新設定圖片的src屬性值
         */
     window.onload = function () {
         // 1.獲取圖片物件
         let img = document.getElementById("checkCode");
         // 2.系結單擊事件
         img.onclick = function () {
             // 加時間戳
             var date = new Date().getTime();
            img.src = "/day15/checkCodeServlet?" + date;
         }
     }

    </script>
</head>
<body>
    <img id="checkCode" src="/day15/checkCodeServlet" alt="">
    <a id="change" href="">看不清換一張？</a>
</body>
</html>

轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/5778.html

標籤：其他

上一篇：怎么學web前端速度快

下一篇：JavaScript進階教程(4)-函式內this指向解惑call()，apply()，bind()的區別