1. 步驟
- 利用BufferedImage對象在內(nèi)存中創(chuàng)建圖片對象易结。
- 美化圖片
- 獲取畫筆
- 設(shè)置顏色
- 填充背景色用fill/畫圖用draw
- 用ImageIO.write()方法傳輸圖片
2. 效果
在這里插入圖片描述
3. 代碼
（1）ResponseServlet.java
@WebServlet("/responseServlet")
public class ResponseServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1. 在內(nèi)存中方創(chuàng)建圖片對象
int width = 200;
int height = 100;
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.BLACK);
g.drawRect(0, 0, width-1, height-1);
//2.3 畫文字
String str = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
Random random = new Random();
for (int i = 0; i < 4; i++) {
int index = random.nextInt(str.length());
char c = str.charAt(index);
g.setColor(Color.BLUE);
g.drawString(c+"", width/5*(i+1), height/2);
}
//2.4 畫干擾線
for (int i = 0; i < 6; i++) {
int x1 = random.nextInt(width);
int x2 = random.nextInt(width);
int y1 = random.nextInt(height);
int y2 = random.nextInt(height);
g.setColor(Color.green);
g.drawLine(x1, y1, x2, y2);
}
//3.傳輸圖片
ImageIO.write(image, "png", response.getOutputStream());
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
new Date();
}
}
（2）regist.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
window.onload = function () {
//1.為圖片綁定事件
var img = document.getElementById("check");
img.onclick = function () {
//獲取時間戳
var time = new Date().getTime();
img.src = "/day7/responseServlet?"+time; //如果請求路徑不變，會返回302，加載緩存中的數(shù)據(jù)，圖片不變
}
//2.為超鏈接綁定事件
var change = document.getElementById("change");
change.onclick = function () {
//獲取時間戳
var time = new Date().getTime();
img.src = "/day7/responseServlet?"+time;
}
}
</script>
</head>
<body>
<img id="check" src="/day7/responseServlet">
<a id="change" href="">看不清，換一張</a>
</body>
</html>
