目錄
1.easy-captcha工具包
2新增依賴
3.驗證碼字元類型
4.字體設定
5驗證碼圖片輸出
6.產生並顯示驗證碼
7.1後端
7.2前端
7 驗證碼的輸入驗證
首頁 Java java教程 springboot驗證碼產生及驗證功能怎麼實現

springboot驗證碼產生及驗證功能怎麼實現

May 17, 2023 pm 12:15 PM
springboot

    1.easy-captcha工具包

    產生驗證碼的方式有許多種,這裡選擇的是easy-captcha工具包。

    github開原位址為:easy-captcha工具包

    此模組提供Java圖形驗證碼支持,包括gif、中文、算術等類型,適用於Java Web和JavaSE等項目。

    2新增依賴

    首先需要將easy-captcha的依賴設定檔增加到pom.xml檔中。

    開源專案中已經寫好了導入依賴語句複製貼上過去即可。

    springboot驗證碼產生及驗證功能怎麼實現

       <dependency>
          <groupId>com.github.whvcse</groupId>
          <artifactId>easy-captcha</artifactId>
          <version>1.6.2</version>
       </dependency>
    登入後複製

    3.驗證碼字元類型

    springboot驗證碼產生及驗證功能怎麼實現

    #使用方法:

    //生成验证码对象
    SpecCaptcha captcha = new SpecCaptcha(130, 48, 5);
    //设置验证码的字符类型
    captcha.setCharType(Captcha.TYPE_ONLY_NUMBER);
    登入後複製

    4.字體設定

    springboot驗證碼產生及驗證功能怎麼實現

    如果不想使用內建字體也可以使用系統字體。使用方法如下:

    //生成验证码对象
    SpecCaptcha captcha = new SpecCaptcha(130, 48, 5);
    
    // 设置内置字体
    captcha.setFont(Captcha.FONT_1); 
    
    // 设置系统字体
    captcha.setFont(new Font("楷体", Font.PLAIN, 28));
    登入後複製

    5驗證碼圖片輸出

    這裡可以選擇輸出為檔案流,這是比較常見的處理方式。當然,也有一些Web項目會使用base64編碼的圖片。這兩種方式easy-captcha都支援。
    base64編碼的輸出方法如下所示:

    SpecCaptcha specCaptcha = new SpecCaptcha(130, 48, 5);
    specCaptcha.toBase64();
    
    // 如果不想要base64的头部data:image/png;base64,
    specCaptcha.toBase64("");  // 加一个空的参数即可
    登入後複製

    輸出到磁碟上的方法如下所示:

    FileOutputStream outputStream = new FileOutputStream(new File("C:/captcha.png"))
    SpecCaptcha specCaptcha = new SpecCaptcha(130, 48, 5);
    specCaptcha.out(outputStream);
    登入後複製

    該段程式碼為產生一張圖片並儲存到磁碟目錄中,這裡可以使用easy-captcha工具自備的out()方法輸出。在開發Web專案時,開發人員會使用 Response 物件的輸出流輸出驗證碼。

    6.產生並顯示驗證碼

    6.1後端

    可以透過新建一個方法來建立KaptchaController類,該類別需要位於controller包中。在方法裡使用GifCaptcha可以產生一個PNG類型的驗證碼對象,並以圖片流的方式輸出到前端以供顯示,程式碼如下所示:

    @Controller
    public class KaptchaController {
        @GetMapping("/kaptcha")
        public void defaultKaptcha(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse) throws Exception{
            httpServletResponse.setHeader("Cache-Control","no-store");
            httpServletResponse.setHeader("Pragma","no-cache");
            httpServletResponse.setDateHeader("Expires",0);
            httpServletResponse.setContentType("image/gif");
    
            //生成验证码对象,三个参数分别是宽、高、位数
            SpecCaptcha captcha = new SpecCaptcha(130, 48, 5);
            //设置验证码的字符类型为数字和字母混合
            captcha.setCharType(Captcha.TYPE_DEFAULT);
            // 设置内置字体
            captcha.setCharType(Captcha.FONT_1);
            //验证码存入session
            httpServletRequest.getSession().setAttribute("verifyCode",captcha.text().toLowerCase());
            //输出图片流
            captcha.out(httpServletResponse.getOutputStream());
        }
    }
    登入後複製

    在控制器中新增defaultKaptcha()方法,此方法攔截處理路徑為/kaptcha。在前端存取該路徑後就可以接收一個圖片流並顯示在瀏覽器頁面上。

    6.2前端

    在static目錄中新建kaptcha.html頁面,在該頁面中顯示驗證碼,程式碼如下所示:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>验证码显示</title>
    </head>
    <body>
    <img  src="/static/imghw/default1.png"  data-src="/kaptcha"  class="lazy"   onclick="this.src=&#39;/kaptcha?d=&#39;+new Date()*1" / alt="springboot驗證碼產生及驗證功能怎麼實現" >
    </body>
    </html>
    登入後複製

    透過存取後端的/kaptcha路徑,取得驗證碼圖片,然後將其顯示在img標籤中。然後編寫一個onclick函數,在點擊該img標籤時能夠動態地切換並顯示一個新的驗證碼。點擊時訪問的路徑為’/kaptcha?d=' new Date()*1,即原來的驗證碼路徑後面帶上一個時間戳參數d。時間戳是會變化的,所以每次點擊都會是與之前不同的請求。如果不這樣處理的話,由於瀏覽器的快取機制,在點擊刷新驗證碼後可能不會重新發送請求,將導致在一段時間內一直顯示同一張驗證碼圖片。

    在編碼完成後,啟動Spring Boot專案。啟動成功後開啟瀏覽器並輸入驗證碼顯示的測試頁面位址

    http://localhost:8080/kaptcha
    登入後複製

    效果如下:

    springboot驗證碼產生及驗證功能怎麼實現

    7 驗證碼的輸入驗證

    一般的做法是在後端產生驗證碼後,先對目前產生的驗證碼內容進行儲存,可以選擇儲存在session物件中,或是儲存在快取中,或是儲存在資料庫中。然後,返回驗證碼圖片並顯示到前端頁面。使用者在識別驗證碼後,在頁面對應的輸入框中填寫驗證碼並向後端發送請求,後端在接到請求後會對使用者輸入的驗證碼進行驗證。如果使用者輸入的驗證碼與先前儲存的驗證碼不相等的話,則傳回「驗證碼錯誤」的提示訊息且不會進行後續的流程,只有驗證成功才會繼續後續的流程。

    7.1後端

    在KaptchaController類別中新增verify()方法,程式碼如下:

        public String verify(@RequestParam("code") String code, HttpSession session){
            if (!StringUtils.hasLength(code)){
                return "验证码不能为空";
            }
            String kaptchaCode = session.getAttribute("verifyCode")+"";
            if (!StringUtils.hasLength(kaptchaCode)||!code.toLowerCase().equals(kaptchaCode)){
                return "验证码错误";
            }
            return "验证成功";
        }
    登入後複製

    使用者輸入的驗證碼請求參數為code,/verify為該方法所攔截處理的路徑。在進行基本的非空驗證後,與先前儲存在session中的verifyCode值進行比較,如果兩個字串不相等則傳回「驗證碼錯誤」的提示,二者相同則傳回「驗證碼成功」的提示。

    7.2前端

    在static目錄中新建verify.html,該頁面會顯示驗證碼,同時也包含供使用者輸入驗證碼的輸入框和提交按鈕,程式碼如下所示:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>验证码测试</title>
    </head>
    <body>
    <img  src="/static/imghw/default1.png"  data-src="/kaptcha"  class="lazy"   onclick="this.src=&#39;/kaptcha?d=&#39;+new Date()*1" / alt="springboot驗證碼產生及驗證功能怎麼實現" >
    <br>
    <input type="text" maxlength="5" id="code" placeholder="请输入验证码" />
    <button id="verify">验证</button>
    <br>
    <p id="verifyResult">
    </p>
    </body>
    <!--jqGrid依赖jQuery,因此需要先引入jquery.min.js文件,下方地址为字节跳动提供的cdn地址-->
    <script src="http://s3.pstatp.com/cdn/expire-1-M/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
        //验证按钮的点击事件
            $(&#39;#verify&#39;).click(function () {
                var code = $(&#39;#code&#39;).val();
                $.ajax({
                    type: &#39;GET&#39;,//方法类型
                    url: &#39;/verify?code=&#39;+code,
                    success: function (result) {
                    //将验证结果显示在p标签中
                        $(&#39;#verifyResult&#39;).html(result);
                    },
                    error:function () {
                        alert(&#39;请求失败&#39;);
                    },
                });
            });
        });
    </script>
    </html>
    登入後複製

    在用户识别并呈现在页面上的验证码之后,他们可以在输入框中输入验证码并点击“验证”按钮。在JS代码中已经定义了“验证”按钮的点击事件,一旦点击,就会获取用户在输入框中输入的内容,并将其作为请求参数向后端发送请求,验证用户输入的验证码是否正确,后端在处理完成后会返回处理结果,拿到处理结果就显示在id为verifyResult的p标签中。

    springboot驗證碼產生及驗證功能怎麼實現

    以上是springboot驗證碼產生及驗證功能怎麼實現的詳細內容。更多資訊請關注PHP中文網其他相關文章!

    本網站聲明
    本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

    熱AI工具

    Undresser.AI Undress

    Undresser.AI Undress

    人工智慧驅動的應用程序,用於創建逼真的裸體照片

    AI Clothes Remover

    AI Clothes Remover

    用於從照片中去除衣服的線上人工智慧工具。

    Undress AI Tool

    Undress AI Tool

    免費脫衣圖片

    Clothoff.io

    Clothoff.io

    AI脫衣器

    AI Hentai Generator

    AI Hentai Generator

    免費產生 AI 無盡。

    熱門文章

    R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
    1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
    R.E.P.O.最佳圖形設置
    1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
    R.E.P.O.如果您聽不到任何人,如何修復音頻
    1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
    R.E.P.O.聊天命令以及如何使用它們
    1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

    熱工具

    記事本++7.3.1

    記事本++7.3.1

    好用且免費的程式碼編輯器

    SublimeText3漢化版

    SublimeText3漢化版

    中文版,非常好用

    禪工作室 13.0.1

    禪工作室 13.0.1

    強大的PHP整合開發環境

    Dreamweaver CS6

    Dreamweaver CS6

    視覺化網頁開發工具

    SublimeText3 Mac版

    SublimeText3 Mac版

    神級程式碼編輯軟體(SublimeText3)

    Springboot怎麼整合Jasypt實現設定檔加密 Springboot怎麼整合Jasypt實現設定檔加密 Jun 01, 2023 am 08:55 AM

    Jasypt介紹Jasypt是一個java庫,它允許開發員以最少的努力為他/她的專案添加基本的加密功能,並且不需要對加密工作原理有深入的了解用於單向和雙向加密的高安全性、基於標準的加密技術。加密密碼,文本,數字,二進位檔案...適合整合到基於Spring的應用程式中,開放API,用於任何JCE提供者...添加如下依賴:com.github.ulisesbocchiojasypt-spring-boot-starter2. 1.1Jasypt好處保護我們的系統安全,即使程式碼洩露,也可以保證資料來源的

    SpringBoot怎麼整合Redisson實現延遲隊列 SpringBoot怎麼整合Redisson實現延遲隊列 May 30, 2023 pm 02:40 PM

    使用場景1、下單成功,30分鐘未支付。支付超時,自動取消訂單2、訂單簽收,簽收後7天未進行評估。訂單超時未評價,系統預設好評3、下單成功,商家5分鐘未接單,訂單取消4、配送超時,推播簡訊提醒…對於延時比較長的場景、即時性不高的場景,我們可以採用任務調度的方式定時輪詢處理。如:xxl-job今天我們採

    怎麼在SpringBoot中使用Redis實現分散式鎖 怎麼在SpringBoot中使用Redis實現分散式鎖 Jun 03, 2023 am 08:16 AM

    一、Redis實現分散式鎖原理為什麼需要分散式鎖在聊分散式鎖之前,有必要先解釋一下,為什麼需要分散式鎖。與分散式鎖相對就的是單機鎖,我們在寫多執行緒程式時,避免同時操作一個共享變數產生資料問題,通常會使用一把鎖來互斥以保證共享變數的正確性,其使用範圍是在同一個進程中。如果換做是多個進程,需要同時操作一個共享資源,如何互斥?現在的業務應用通常是微服務架構,這也意味著一個應用會部署多個進程,多個進程如果需要修改MySQL中的同一行記錄,為了避免操作亂序導致髒數據,此時就需要引入分佈式鎖了。想要實現分

    springboot讀取檔案打成jar包後存取不到怎麼解決 springboot讀取檔案打成jar包後存取不到怎麼解決 Jun 03, 2023 pm 04:38 PM

    springboot讀取文件,打成jar包後訪問不到最新開發出現一種情況,springboot打成jar包後讀取不到文件,原因是打包之後,文件的虛擬路徑是無效的,只能通過流去讀取。文件在resources下publicvoidtest(){Listnames=newArrayList();InputStreamReaderread=null;try{ClassPathResourceresource=newClassPathResource("name.txt");Input

    Springboot+Mybatis-plus不使用SQL語句進行多表新增怎麼實現 Springboot+Mybatis-plus不使用SQL語句進行多表新增怎麼實現 Jun 02, 2023 am 11:07 AM

    在Springboot+Mybatis-plus不使用SQL語句進行多表添加操作我所遇到的問題準備工作在測試環境下模擬思維分解一下:創建出一個帶有參數的BrandDTO對像模擬對後台傳遞參數我所遇到的問題我們都知道,在我們使用Mybatis-plus中進行多表操作是極其困難的,如果你不使用Mybatis-plus-join這一類的工具,你只能去配置對應的Mapper.xml文件,配置又臭又長的ResultMap,然後再寫對應的sql語句,這種方法雖然看上去很麻煩,但具有很高的靈活性,可以讓我們

    SpringBoot與SpringMVC的比較及差別分析 SpringBoot與SpringMVC的比較及差別分析 Dec 29, 2023 am 11:02 AM

    SpringBoot和SpringMVC都是Java開發中常用的框架,但它們之間有一些明顯的差異。本文將探究這兩個框架的特點和用途,並對它們的差異進行比較。首先,我們來了解一下SpringBoot。 SpringBoot是由Pivotal團隊開發的,它旨在簡化基於Spring框架的應用程式的建立和部署。它提供了一種快速、輕量級的方式來建立獨立的、可執行

    SpringBoot怎麼自訂Redis實作快取序列化 SpringBoot怎麼自訂Redis實作快取序列化 Jun 03, 2023 am 11:32 AM

    1.自訂RedisTemplate1.1、RedisAPI預設序列化機制基於API的Redis快取實作是使用RedisTemplate範本進行資料快取操作的,這裡開啟RedisTemplate類,查看該類別的源碼資訊publicclassRedisTemplateextendsRedisAccessorimplementsRedisOperations,BeanClassLoaderAware{//聲明了value的各種序列化方式,初始值為空@NullableprivateRedisSe

    springboot怎麼取得application.yml裡值 springboot怎麼取得application.yml裡值 Jun 03, 2023 pm 06:43 PM

    在專案中,很多時候需要用到一些配置信息,這些信息在測試環境和生產環境下可能會有不同的配置,後面根據實際業務情況有可能還需要再做修改。我們不能將這些設定在程式碼中寫死,最好是寫到設定檔中,例如可以把這些資訊寫到application.yml檔案中。那麼,怎麼在程式碼裡取得或使用這個位址呢?有2個方法。方法一:我們可以透過@Value註解的${key}即可取得設定檔(application.yml)中和key對應的value值,這個方法適用於微服務比較少的情形方法二:在實際專案中,遇到業務繁瑣,邏

    See all articles