Spring總結二-配置驗證碼

在許多網頁中我們都可以看到驗證碼的存在，驗證碼就是用來進行人機識別的，防止腳本或爬蟲無限制地請求網頁導致資源浪費，本篇博客就是介紹如何在 Spring 和 Springboot 中配置驗證碼模塊。

本博客使用的驗證碼包 wiki 地址 https://code.google.com/archive/p/kaptcha/

Maven 導包

首先在 Maven 中導入使用驗證碼所需要使用到的包

<dependency>
            <groupId>com.github.penggle</groupId>
            <artifactId>kaptcha</artifactId>
            <version>2.3.2</version>
</dependency>

Web.xml 配置 Servlet 參數

接着我們進入 Web.xml, 來配置驗證碼相關的 Servlet 和具體的參數，就按照普通 Servlet 的配置方法，Servlet 的類名爲 com.google.code.kaptcha.servlet.KaptchaServlet，在 servlet-mapping 中配置 / Kaptcha 截獲驗證碼請求到 Servlet，最後在 Servlet 中配置 init-param 參數。

<servlet>
        <servlet-name>Kaptcha</servlet-name>
        <servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>
        <!-- 有無邊框 -->
        <init-param>
            <param-name>kaptcha.border</param-name>
            <param-value>no</param-value>
        </init-param>
        <!-- 圖片顏色 -->
        <init-param>
            <param-name>kaptcha.textproducer.font.color</param-name>
            <param-value>red</param-value>
        </init-param>
        <!-- 圖片寬度 -->
        <init-param>
            <param-name>kaptcha.image.width</param-name>
            <param-value>125</param-value>
        </init-param>
        <!-- 使用那些字符產生驗證碼 -->
        <init-param>
            <param-name>kaptcha.textproducer.char.string</param-name>
            <param-value>ACDEFHKPRSTWX345679</param-value>
        </init-param>
        <!-- 圖片高度 -->
        <init-param>
            <param-name>kaptcha.image.height</param-name>
            <param-value>50</param-value>
        </init-param>
        <!-- 字體大小 -->
        <init-param>
            <param-name>kaptcha.textproducer.font.size</param-name>
            <param-value>43</param-value>
        </init-param>
        <!-- 干擾線的顏色 -->
        <init-param>
            <param-name>kaptcha.noise.color</param-name>
            <param-value>black</param-value>
        </init-param>
        <!-- 字符個數 -->
        <init-param>
            <param-name>kaptcha.textproducer.char.length</param-name>
            <param-value>4</param-value>
        </init-param>
        <!-- 字符字體 -->
        <init-param>
            <param-name>kaptcha.textproducer.font.names</param-name>
            <param-value>Arial</param-value>
        </init-param>
    </servlet>
    <servlet-mapping>
        <servlet-name>Kaptcha</servlet-name>
        <url-pattern>/Kaptcha</url-pattern>
    </servlet-mapping>

網頁使用

在前端網頁裏只要向’項目地址 / Kaptcha’發起請求就可以獲得驗證碼了，具體代碼如下：

 <img id="captcha_img" alt="點擊更換" title="點擊更換"
                  onclick="changeVerifyCode(this)" src="../Kaptcha" />

由於隨機產生的驗證碼可能不是很清楚，所以最好加一個點擊事件點擊驗證碼就可以更換一張驗證碼，js 代碼如下：

function changeVerifyCode(img) {
    img.src="../Kaptcha?"+Math.floor(Math.random()*100);
}

後端驗證

用戶填寫了驗證碼，向服務器發起了 request，這個 request 就包含了用戶輸入的驗證碼，後臺的工作就是需要驗證驗證碼是否填寫正確了，如果填寫錯誤則需要立即返回錯誤信息告知用戶，驗證碼的正確內容是存在 session 的 Constants.KAPTCHA_SESSION_KEY 中，所以我們只需要取出正確的驗證碼內容和用戶輸入的驗證碼內容就可以完成驗證。

public class CodeUtil
{
    public static boolean checkVerifyCode(HttpServletRequest request)
    {
        String verifyCodeExpected= (String) request.getSession().getAttribute(Constants.KAPTCHA_SESSION_KEY);
        String verifyCodeActual = HttpServletRequestUtil.getString(request, "verifyCodeActual");
        if (verifyCodeActual == null || !verifyCodeActual.toLowerCase().equals(verifyCodeExpected.toLowerCase()))
        {
            return false;
        }
        return true;
    }
}

可以寫一個工具類來複用代碼

SpringBoot 的驗證碼配置

SpringBoot 的配置其實和 Spring 的配置是差不多的，只不過 SpringBoot 崇尚去 xml 化，以上所有在 xml 上書寫的內容都需要在代碼中配置。

首先在 application.properties 中把要用的參數信息提前寫好

#Kaptcha相關
kaptcha.border=no
kaptcha.textproducer.font.color=red
kaptcha.image.width=135
kaptcha.textproducer.char.string=ACDEFHKPRSTWX345679
kaptcha.image.height=50
kaptcha.textproducer.font.size=43
kaptcha.noise.color=black
kaptcha.textproducer.char.length=4
kaptcha.textproducer.font.names=Arial

其次我們需要在 @Configuration 配置文件中自行配置一個 Servlet 來取代之前在 Web.xml 中的操作，其實具體操作很簡單也和之前很相似, 聲明一個映射特定路徑的 Servlet ，或是需要配置初始化參數的話，需要使用ServletRegistrationBean。

@Bean(name="captchaProducer")
    public ServletRegistrationBean servletRegistrationBean() throws ServletException
    {
        ServletRegistrationBean servlet = new ServletRegistrationBean(new KaptchaServlet(), "/Kaptcha");
        servlet.addInitParameter("kaptcha.border", border);
        servlet.addInitParameter("kaptcha.textproducer.font.color", fcolor);
        servlet.addInitParameter("kaptcha.image.width", width);
        servlet.addInitParameter("kaptcha.textproducer.char.string", cString);
        servlet.addInitParameter("kaptcha.image.height", height);
        servlet.addInitParameter("kaptcha.textproducer.font.size", fsize);
        servlet.addInitParameter("kaptcha.noise.color", nColor);
        servlet.addInitParameter("kaptcha.textproducer.char.length", clength);
        servlet.addInitParameter("kaptcha.textproducer.font.names", fnames);
        return servlet;
    }

至此 SpringBoot 的驗證碼就配置完了。