คำนำ:
เกี่ยวกับการแนะนำ Kaptcha และการรวมกันของ Spring Kaptcha ฉันได้อธิบายรายละเอียดในบทความอื่น โปรดดูที่: รหัสตรวจสอบ Spring Kaptcha
บทความนี้จะแนะนำสองวิธีในการรวม Springboot เข้ากับ Kaptcha
เครื่องมือและเทคโนโลยีการพัฒนา:
1. Idea 2017
2. Springboot 2.0.2
3. Kaptcha
เริ่มต้นอย่างเป็นทางการ:
วิธีที่ 1: กำหนดค่าผ่าน kaptcha.xml
1. สร้าง Spring Initializr ใหม่โดยใช้แนวคิด
2. เพิ่ม Kaptcha Dependencies:
<!-รหัสการตรวจสอบ Kaptcha-> <การพึ่งพา> <roupId> com.github.penggle </groupId> <ratifactid> kaptcha </artifactid> <version> 2.3.2 </version>
3. สร้าง kaptcha.xml ใหม่ภายใต้ทรัพยากรด้วยเนื้อหาต่อไปนี้:
kaptcha.xml
<? xml version = "1.0" การเข้ารหัส = "utf-8"?> <beans xmlns = "http://www.springframework.org/schema/beans" xmlns: xsi = "http://ww.w3.org/2001/xml XSI: schemalocation = "http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd"> <! <constructor-arg type = "java.util.properties"> <!-ตั้งค่าคุณสมบัติ kaptcha-> <props> <prop key = "kaptcha.border"> ใช่ </prop> <prop key = "kaptcha.border.color"> 105,179,90 key = "kaptcha.textproducer.font.color"> blue </prop> <prop key = "kaptcha.image.width"> 100 </prop> <prop key = "kaptcha.image.height"> 50 </prop> key = "kaptcha.image.height"> 50 </prop> <prop key = "kaptcha.image.height"> 50 </prop> <prop key = "kaptcha.image.height"> 50 </prop> <prop key = "kaptcha. key =" kaptcha.textproducer.font.size key = "kaptcha.session.key"> รหัส </prop> <prop key = "kaptcha.textproducer.char.length"> 4 </prop> <prop key = "kaptcha.textproducer.font.names"> ตัวอักษรเพลง key = "kaptcha.textproducer.char.string"> 0123456789abcefghijklmnopqrstuvwxyz </prop> <prop key = "kaptcha.obscurificator.impl" key = "kaptcha.noise.color"> ดำ </prop> <prop key = "kaptcha.noise.impl"> com.google.code.kaptcha.impl.defaultnoise </prop> <prop key = "kaptcha.background.clear.from" key = "kaptcha.background.clear.to"> White </prop> <prop key = "kaptcha.textproducer.char.space"> 3 </prop> </props> </constructor-Arg> </ebean>
หมายเหตุ: เนื้อหาใน kaptcha.xml นั้นเหมือนกับเนื้อหาใน Spring-kaptcha.xml เมื่อ Spring รวม Kaptcha มันหมายถึงการส่ง kaptcha ไปยังการจัดการคอนเทนเนอร์ฤดูใบไม้ผลิตั้งค่าคุณสมบัติบางอย่างและจากนั้นฉีดโดยตรงเมื่อจำเป็น
4. โหลด kaptcha.xml:
เพิ่ม @ImportResource(locations = {"classpath:kaptcha/kaptcha.xml"})， เพิ่มคำอธิบายประกอบนี้ Springboot จะโหลดไฟล์ kaptcha.xml โปรดทราบว่าไม่ควรเขียนเส้นทางของ kaptcha.xml อย่างไม่ถูกต้อง classpath เป็นไดเรกทอรีทรัพยากรที่นี่
5. เขียนคอนโทรลเลอร์เพื่อสร้างรหัสการตรวจสอบ:
codecontroller.java
@ControllerPublic คลาส codecontroller {@autowired ผู้ผลิตเอกชน captchaproducer = null; @RequestMapping ("/kaptcha") โมฆะสาธารณะ getKaptChaimage (คำขอ httpservletRequest, การตอบกลับ httpservletResponse) โยนข้อยกเว้น {httpsession session = request.getSession (); Response.setDateHeader ("หมดอายุ", 0); Response.SetheAder ("Cache-Control", "ไม่มีร้านค้าไม่ต้อง-ต้องทำการตรวจสอบ"); Response.addheader ("แคชควบคุม", "post-check = 0, pre-check = 0"); Response.Setheader ("Pragma", "No-cache"); Response.SetContentType ("Image/JPEG"); // สร้างสตริงการตรวจสอบรหัส captext = captchaproducer.createtext (); session.setAttribute (ค่าคงที่ kaptcha_session_key, captext); // เขียน bufferedImage ไปยังไคลเอนต์ bi = captchaproducer.createImage (captext); servletoutputStream out = response.getOutputStream (); imageio.write (bi, "jpg", ออก); ลอง {out.flush (); } ในที่สุด {out.close (); -หมายเหตุ: ฉีดถั่วเพียงกำหนดค่าใน kaptcha.xml ในเส้นทางคอนโทรลเลอร์นี้จากนั้นคุณสามารถใช้มันเพื่อสร้างรหัสการตรวจสอบและส่งออกรหัสการตรวจสอบไปยังไคลเอนต์; โปรดจำไว้ว่าเส้นทางของคลาสนี้ SRC ของรหัสการตรวจสอบของหน้าส่วนหน้าต้องชี้ไปที่เส้นทางนี้
6. สร้างเครื่องมือเปรียบเทียบรหัสตรวจสอบใหม่:
codeutil.java
คลาสสาธารณะ codeutil { / ** * แปลงพารามิเตอร์ front-end ที่ได้รับเป็นประเภทสตริง * @param คำขอ * @param คีย์ * @return * / สตริงคงที่สาธารณะ getString (httpservletRequest คำขอคีย์สตริง) {ลอง {string result = request.getParameter (key); if (result! = null) {result = result.trim (); } if ("". เท่ากับ (ผลลัพธ์)) {result = null; } ผลตอบแทนผลลัพธ์; } catch (exception e) {return null; }} /** * การตรวจสอบรหัสการตรวจสอบ * @param คำขอ * @return * /public boolean public checkverifyCode (คำขอ httpservletrequest) {// รับสตริงการตรวจสอบที่สร้างขึ้น verifyCodeExpected = (สตริง) คำขอ. getSession () // รับรหัสการตรวจสอบที่ป้อนโดยสตริงผู้ใช้ VerifyCodeActual = codeUtil.getString (คำขอ, "VerifyCodeActual"); if (VerifyCodeActual == NULL ||! VerifyCodeActual.equals (VerifyCodeExpected)) {return false; } return true; -หมายเหตุ: คลาสนี้ใช้เพื่อเปรียบเทียบรหัสการตรวจสอบที่สร้างขึ้นกับรหัสการตรวจสอบที่ป้อนโดยผู้ใช้ รหัสการตรวจสอบที่สร้างขึ้นจะถูกเพิ่มลงในเซสชันโดยอัตโนมัติและการป้อนข้อมูลผู้ใช้จะได้รับผ่าน GetParameter โปรดทราบว่าค่าคีย์ของ getParameter ควรสอดคล้องกับค่าชื่อของรหัสการตรวจสอบในหน้า
7. ใช้รหัสยืนยัน:
①เครื่องควบคุม
helloworld.java
@RestControllerPublic คลาส helloWorld {@requestmapping ("/hello") สตริงสาธารณะสวัสดี (คำขอ httpservletrequest) {ถ้า (! codeutil.checkverifycode (คำขอ) {return "รหัสการตรวจสอบไม่ถูกต้อง!"; } else {return "Hello, World"; - ②หน้า
สวัสดี. html
<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> title </title> <script type = "text/javascript"> function refresh () {document.getElementById ('captcha_img') } </script> </head> <body> <form action = "/hello" method = "post"> รหัสการตรวจสอบ: <อินพุต type = "text" placeholder = "โปรดป้อนรหัสการตรวจสอบ" name = "VerifyCodeActual"> <div> <img id = "captcha_img /> </form> </body> </html>หมายเหตุ: รหัสการตรวจสอบเป็นภาพเป็นหลักดังนั้นให้ใช้แท็ก <Img> จากนั้นใช้ src = "/kaptcha" เพื่อชี้ไปที่เส้นทางของคอนโทรลเลอร์ที่สร้างรหัสการตรวจสอบ โทรไปที่รหัส JS ผ่าน onClick = "Refresh ()" เพื่อรับรู้ฟังก์ชั่นการคลิกเพื่อสลับ ให้ความสนใจกับค่าของชื่อใน <อินพุตชื่อ = "VerifyCodeActual"> และค่าคีย์ที่ส่งผ่านเมื่อได้รับรหัสการตรวจสอบที่ป้อนโดยผู้ใช้ผ่านวิธี getParameter () ของการร้องขอใน codeUtil ควรสอดคล้องกับค่าชื่อที่นี่
8. ทดสอบ:
ป้อนรหัสการยืนยันที่ถูกต้อง
ผ่านการตรวจสอบ
ป้อนรหัสการยืนยันที่ไม่ถูกต้อง
การตรวจสอบล้มเหลว
วิธีที่ 2: กำหนดค่า kaptcha ผ่านคลาสการกำหนดค่า
1. กำหนดค่า kaptcha
เมื่อเทียบกับวิธีหนึ่งการเพิ่มขึ้นหนึ่งและลดลงสองครั้ง
ลด:
①Delete kaptcha.xml ②delete @ImportResource(locations = {"classpath:kaptcha/kaptcha.xml"}) คำอธิบายประกอบในคลาสเริ่มต้น
เพิ่มขึ้น:
①สร้างคลาสการกำหนดค่า kaptchaconfig ใหม่เนื้อหามีดังนี้:
kaptchaconfig.java
@ConfigurationPublic คลาส kaptchaconfig {@bean public defaultkaptcha getdefaultkaptcha () {defaultkaptcha captchaproducer = ใหม่ defaultKaptcha (); คุณสมบัติคุณสมบัติ = คุณสมบัติใหม่ (); Properties.SetProperty ("kaptcha.border", "ใช่"); Properties.SetProperty ("kaptcha.border.color", "105,179,90"); Properties.setProperty ("kaptcha.textproducer.font.color", "blue"); Properties.SetProperty ("kaptcha.image.width", "110"); Properties.SetProperty ("kaptcha.image.height", "40"); Properties.SetProperty ("kaptcha.textproducer.font.size", "30"); Properties.SetProperty ("kaptcha.session.key", "รหัส"); Properties.SetProperty ("kaptcha.textproducer.char.length", "4"); Properties.SetProperty ("kaptcha.textproducer.font.names", "Song Font, Kai Font, Microsoft Yahei"); config = config ใหม่ (คุณสมบัติ); captchaproducer.setconfig (config); ส่งคืน Captchaproducer; -หมายเหตุ: คลาสนี้ใช้เพื่อกำหนดค่า kaptcha ซึ่งเทียบเท่ากับ kaptcha.xml ในวิธีการ 1. เพิ่ม kaptcha ไปยังคอนเทนเนอร์ IOC จากนั้นกลับไปที่อินสแตนซ์ด้วยคุณสมบัติที่ตั้งไว้และในที่สุดก็ฉีดเข้าไปในตัวแปลงสัญญาณ คุณสามารถใช้เพื่อสร้างรหัสการยืนยันในตัวควบคุม codeController ให้ความสนใจเป็นพิเศษเพื่อส่งคืน Captchaproducer; ชื่อของ Captchaproducer ในผู้ผลิตเอกชน CaptChaproducer = null; มิฉะนั้นถั่วจะไม่ถูกโหลด
2. ทดสอบ:
ป้อนรหัสการตรวจสอบที่ถูกต้อง:
ผ่านการตรวจสอบ
ป้อนรหัสการยืนยันที่ไม่ถูกต้อง
การตรวจสอบล้มเหลว
เพื่ออธิบายว่ารหัสการตรวจสอบของสองครั้งถูกสร้างขึ้นตามสองวิธีรหัสการตรวจสอบของวิธีแรกและวิธีที่สองจะถูกตั้งค่าแอตทริบิวต์ที่แตกต่างกัน จากภาพเราจะเห็นได้ว่าสีเส้นรบกวนพื้นหลัง ฯลฯ ของรหัสการตรวจสอบของสองครั้งนั้นแตกต่างกัน
สรุป:
1. การจัดเรียงกระบวนการ:
ไม่ว่าทางใดคุณควรเพิ่ม Kaptcha ลงในภาชนะฤดูใบไม้ผลินั่นคือควรมีถั่ว Kaptcha; จากนั้นสร้างคอนโทรลเลอร์ใหม่และฉีดถั่ว Kaptcha ลงในคอนโทรลเลอร์เพื่อสร้างรหัสการตรวจสอบ จากนั้นมีคลาสเครื่องมือที่เปรียบเทียบรหัสการตรวจสอบและเรียกคลาสเครื่องมือในคอนโทรลเลอร์ทดสอบสำหรับการเปรียบเทียบรหัสการตรวจสอบ ในที่สุดในหน้าส่วนหน้าคุณจะต้องใช้ <img src = "/生成验证码的controller的路由"> เพื่อรับรหัสการตรวจสอบ โดยการเพิ่มเหตุการณ์คลิกลงในแท็ก IMG นี้คุณสามารถรับรู้ "คลิกเพื่อสลับรหัสการตรวจสอบ"
2. เปรียบเทียบกับการรวม Spring Kaptcha
การรวม Spring Kaptcha ยังแนะนำสองวิธี การกำหนดค่าเป็นวิธีที่ง่ายที่สุดใน web.xml และไม่จำเป็นต้องเขียนคอนโทรลเลอร์ที่สร้างรหัสการยืนยัน ในหน้านี้ให้ใช้ SRC เพื่อชี้ไปที่ค่า <url-pattern> ของ servlet ของ Kaptcha ใน web.xml
ทั้งสองวิธีของการรวม Kaptcha นั้นคล้ายกับวิธีที่สองของการรวม Kaptcha พวกเขาจะใช้ในการกำหนดค่าถั่วก่อนจากนั้นใช้คอนโทรลเลอร์เพื่อสร้างรหัสการตรวจสอบ ส่วนหน้าใช้ SRC เพื่อชี้ไปที่คอนโทรลเลอร์นี้ ความแตกต่างคือถ้าคอนโทรลเลอร์ที่สร้างรหัสการตรวจสอบคือ /xxx ดังนั้น src = "xxx.jpg" เมื่อ Springboot รวม kaptcha src = "/xxx"。
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น