在現代Web應用中，圖片驗證碼是一種常見的安全措施，用于防止自動化腳本或機器人進行惡意操作。通過生成一張包含隨機字符的圖片，并要求用戶輸入圖片中的字符，可以有效防止惡意攻擊。本文將介紹如何使用Spring Boot和Hutool庫來實現圖片驗證碼功能。
在開始之前，確保你已經具備以下環境：
首先，使用Spring Initializr創建一個新的Spring Boot項目。選擇以下依賴：
生成項目后，解壓并導入到你的IDE中。
在pom.xml中添加Hutool的依賴：
<dependency>
<groupId>cn.hutool</groupId>
<artifactId>hutool-all</artifactId>
<version>5.8.11</version>
</dependency>
Hutool是一個Java工具庫，提供了豐富的工具類和方法，能夠簡化開發過程。
首先，我們創建一個工具類CaptchaUtil，用于生成圖片驗證碼。
import cn.hutool.captcha.CaptchaUtil;
import cn.hutool.captcha.LineCaptcha;
import cn.hutool.captcha.generator.RandomGenerator;
import org.springframework.stereotype.Component;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
@Component
public class CaptchaUtil {
// 定義驗證碼的寬度和高度
private static final int WIDTH = 100;
private static final int HEIGHT = 40;
// 定義驗證碼的字符集
private static final String CHAR_SET = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
// 定義驗證碼的長度
private static final int CODE_LENGTH = 4;
public void generateCaptcha(HttpServletRequest request, HttpServletResponse response) throws IOException {
// 創建驗證碼對象
LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(WIDTH, HEIGHT);
// 設置驗證碼字符集
RandomGenerator randomGenerator = new RandomGenerator(CHAR_SET, CODE_LENGTH);
lineCaptcha.setGenerator(randomGenerator);
// 生成驗證碼
lineCaptcha.createCode();
// 將驗證碼存入session
HttpSession session = request.getSession();
session.setAttribute("captcha", lineCaptcha.getCode());
// 將驗證碼圖片寫入響應流
response.setContentType("image/png");
lineCaptcha.write(response.getOutputStream());
}
public boolean verifyCaptcha(HttpServletRequest request, String userInput) {
HttpSession session = request.getSession();
String captcha = (String) session.getAttribute("captcha");
// 驗證用戶輸入的驗證碼是否正確
return captcha != null && captcha.equalsIgnoreCase(userInput);
}
}
在這個工具類中，我們使用了Hutool的LineCaptcha類來生成帶有干擾線的圖片驗證碼。驗證碼的字符集和長度可以根據需求進行調整。
接下來，我們創建一個控制器CaptchaController，用于處理驗證碼的生成和驗證請求。
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@Controller
public class CaptchaController {
@Autowired
private CaptchaUtil captchaUtil;
@GetMapping("/captcha")
public void getCaptcha(HttpServletRequest request, HttpServletResponse response) throws IOException {
captchaUtil.generateCaptcha(request, response);
}
@PostMapping("/verify")
@ResponseBody
public String verifyCaptcha(HttpServletRequest request, @RequestParam String captcha) {
boolean isValid = captchaUtil.verifyCaptcha(request, captcha);
return isValid ? "驗證碼正確" : "驗證碼錯誤";
}
}
在這個控制器中，我們定義了兩個端點：
/captcha：用于生成驗證碼圖片，并將其寫入響應流。/verify：用于驗證用戶輸入的驗證碼是否正確。為了測試驗證碼功能，我們可以創建一個簡單的前端頁面index.html。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>驗證碼測試</title>
</head>
<body>
<h1>驗證碼測試</h1>
<form action="/verify" method="post">
<img src="/captcha" alt="驗證碼" onclick="this.src='/captcha?'+Math.random()">
<br>
<input type="text" name="captcha" placeholder="請輸入驗證碼">
<br>
<button type="submit">提交</button>
</form>
</body>
</html>
在這個頁面中，我們使用了一個<img>標簽來顯示驗證碼圖片，并通過onclick事件實現點擊刷新驗證碼的功能。用戶輸入驗證碼后，點擊提交按鈕，表單將提交到/verify端點進行驗證。
完成以上步驟后，啟動Spring Boot項目。訪問http://localhost:8080，你將看到驗證碼測試頁面。輸入驗證碼并提交，頁面將返回驗證結果。
在實際應用中，驗證碼通常需要設置過期時間?？梢酝ㄟ^在CaptchaUtil類中添加過期時間邏輯來實現。
import java.util.concurrent.TimeUnit;
@Component
public class CaptchaUtil {
// 定義驗證碼的過期時間（單位：秒）
private static final long EXPIRE_TIME = 60;
public void generateCaptcha(HttpServletRequest request, HttpServletResponse response) throws IOException {
// 生成驗證碼
LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(WIDTH, HEIGHT);
RandomGenerator randomGenerator = new RandomGenerator(CHAR_SET, CODE_LENGTH);
lineCaptcha.setGenerator(randomGenerator);
lineCaptcha.createCode();
// 將驗證碼存入session，并設置過期時間
HttpSession session = request.getSession();
session.setAttribute("captcha", lineCaptcha.getCode());
session.setAttribute("captcha_time", System.currentTimeMillis());
// 將驗證碼圖片寫入響應流
response.setContentType("image/png");
lineCaptcha.write(response.getOutputStream());
}
public boolean verifyCaptcha(HttpServletRequest request, String userInput) {
HttpSession session = request.getSession();
String captcha = (String) session.getAttribute("captcha");
Long captchaTime = (Long) session.getAttribute("captcha_time");
// 檢查驗證碼是否過期
if (captchaTime == null || System.currentTimeMillis() - captchaTime > TimeUnit.SECONDS.toMillis(EXPIRE_TIME)) {
return false;
}
// 驗證用戶輸入的驗證碼是否正確
return captcha != null && captcha.equalsIgnoreCase(userInput);
}
}
在這個優化版本中，我們在generateCaptcha方法中將驗證碼生成時間存入session，并在verifyCaptcha方法中檢查驗證碼是否過期。
在前端頁面中，我們已經實現了點擊驗證碼圖片刷新驗證碼的功能。如果你希望進一步優化用戶體驗，可以考慮使用Ajax來實現無刷新驗證碼更新。
<script>
function refreshCaptcha() {
var img = document.getElementById("captchaImg");
img.src = "/captcha?" + Math.random();
}
</script>
<img id="captchaImg" src="/captcha" alt="驗證碼" onclick="refreshCaptcha()">
通過這種方式，用戶點擊驗證碼圖片時，頁面不會刷新，而是直接更新驗證碼圖片。
通過本文的介紹，你已經學會了如何使用Spring Boot和Hutool庫來實現圖片驗證碼功能。驗證碼是Web應用中常見的安全措施，能夠有效防止自動化腳本的攻擊。在實際應用中，你可以根據需求進一步優化驗證碼的生成和驗證邏輯，例如設置驗證碼的過期時間、增加驗證碼的復雜度等。
希望本文對你有所幫助，祝你在開發過程中順利實現圖片驗證碼功能！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
