Spring Integrated Kaptcha Verification Code의 구현

Kaptcha 소개 :

Kaptcha는 매우 유용한 검증 코드 생성 도구입니다. 구성 가능한 많은 항목이 있으므로 다양한 검증 코드를 쉽고 빠르게 생성 할 수 있습니다.

사용 된 개발 도구 및 핵심 기술 :

1. 일식

2. mybatis

3. 봄

4. Springmvc

5. Kaptcha

이 기사는 Kaptcha를 사용하는 두 가지 방법을 소개합니다.

방법 1 : Spring-Kaptcha.xml 에서 구성

방법 2 : web.xml 에서 구성합니다

공식적으로 시작 :

1. 골격을 만듭니다

1. 종속성 추가 :

 <!-검증 코드-> <pectionency> <groupId> com.github.penggle </groupid> <artifactid> kaptcha </artifactid> <bersion> 2.3.2 </version> </fectionency>

Spring 및 Mybatis 종속성을 제외한 Kaptcha 확인 코드를 사용하려면이 코드를 소개하십시오.

2. 구성 파일을 향상시킵니다

spring-dao.xml

 <!-myBatis 프로세스의 통합-> <!-1. 데이터베이스 관련 매개 변수 속성의 속성을 구성 : $ {url}-> 컨텍스트 : 속성-placeholder 위치 = "classPath : jdbc.properties" /> <!-2. <bean id = "<!-gnouture"> <! 속성-> <property name = "driver class"value = "$ {jdbc.driver}"/> <property name = "jdbcurl"value = "$ {jdbc.url}"/> <property name = "user"value = "$ {jdbc.username}"/>> <valess = "jdbc. C3P0 연결 풀의 속성-> <속성 이름 = "maxpoolsize"value = "30"/> <속성 이름 = "minpoolsize"value = "10"/> <!-연결을 닫고 자동으로 커밋되지 않습니다-> <속성 이름 = "autocommitonClose"value = "false"/> <!-연결 시간-> <value of at letrice get timeout = "10000 연결이 실패 할 때-> <속성 이름 = "acquireretryAttempts"value = "2"/> </bean> <!-연결 시간 초과 시간을 가져옵니다-> <속성 이름 = "checkoutTimeout"value = "100000"/> <!-연결이 실패 할 때 재시도 수단-> <속성 이름 = "acquireRetchAttempts"value = "2"<! <! 이름 = "checkoutTimeout"value = "10000"/> <!-연결이 실패 할 때의 복원 숫자-> <속성 이름 = "acquireretryAttempts"value = "2"/> </bean> <!-3. myBatis의 sqlsessionActortory-> <bean id = "sqlsessionfactory"> dataSource "ref ="autouce "/>/>. mappers.xml 파일-> <속성 이름 = "mapperlocations"value = "classpath : mappers/*. xml"/> <!-mybatis configuration file-> <property name = "configlocation"value = "classpath : mybatis-config.xml"/> <!-antity scan at alias = "property package를 사용합니다. value = "com.zhu.kaptcha.entity"> </property> </bean> <!-4. 스프링은 dao 인터페이스에서 클래스를 자동으로 찾을 것입니다-> <bean> <property name = "basepackage"value = "com.zhu.kaptcha.dao"/> <sqlsessionbeanname "value ="sqlsection actionory "> </beanname"

Spring-service.xml

 <!-서비스 패키지의 모든 주석을 스캔-> <context : component-scan base-package = "com.zhu.kaptcha.service"/> <!-트랜잭션 관리-> <bean id = "transactionManager"> <속성 이름 = "datasource"ref = "dataSource"/> </bean> <! Transaction-Manager = "TransactionManager"/>

Spring-web.xml

 <!-springmvc-> <!-1. springmvc 주석 모드를 켜십시오-> <mvc : 주석 구동 /> <!-2. view 파서 정의-> <bean id = "veen id ="viewresolver "> <property name ="prefix "value ="/"/> <property name ="접미사 "value =".

web.xml

 <Servlet> <servlet-name> Spring-dispatcher </servlet-name> <servlet-class> org.spramframework.web.servlet.dispatcherServlet </servlet-class> <init-param> <param-name> contextConfiglocation </param-name> <param-name> classpath : spring/spring-* </servlet> <servlet-mapping> <servlet-name> spring-dispatcher </servlet-name> <url-pattern>/</url-pattern> </url-pattern> </servlet-mapping> <!-인코딩 필터-> <filter-name> encodingfilter </filter-name> <filter-class> org.springframework.web.filter.characterencodingfilter </filter-class> <Async-supported> true </async-supported> <init-param> <param-name> encoding </param-name> <param- value> utf-8 </param-value> <filter-name> encodingFilter </filter-name> <url-pattern>/*</url-pattern> </filter-mapping>

이 시점에서 골격이 쌓이고 데이터베이스 작업이 완료됩니다.

2. 데이터베이스 작동

1. 엔티티 레이어

user.java

 공개 클래스 사용자 {private int uid; 개인 문자열 사용자 이름; 개인 문자열 비밀번호;}

2. dao 층

userdao.java

 공개 인터페이스 userDao {user findUserByUserName (String username);}

userdao.xml

 <? xml version = "1.0"encoding = "utf-8"?> <! doctype mapperpublic "-// mybatis.org//dtd mapper 3.0 // en" "http://mybatis.org/dtd/mybatis-3-mapper.dtd "> <mapper namespace = "com.zhu.kaptcha.dao.userdao"> <select id = "findUserByUserName"resultType = "com.zhu.kaptcha.entity.user"> select * from tb_user where here user_name =#{username} </select> </mapper>

3. 서비스 계층

usererviceimpl.java

 @ServicePublic Class usererViceimpl은 userErvice {@autowired private userdao userdao; @override public boolean login (문자열 사용자 이름, 문자열 암호) {user user = userdao.finduserbyusername (username); if (password.equals (user.getPassword ())) {return true; } else {return false; }}}

참고 : DAO 계층 및 서비스 계층에 글을 쓸 때는 주니트 테스트를 수행해야합니다. 테스트는 비교적 간단하므로 여기서 설명하지 않습니다.

3. KAPTCHA 통합

방법 1 : Spring-Kaptcha.xml을 통해 구성합니다

1. 스프링 리소스 폴더에서 다음 컨텐츠로 새 Spring-Kaptcha.xml 구성 파일을 만듭니다.

Spring-Kaptcha.xml

 <bean id = "CaptChaProducer"> <속성 이름 = "config"> <ean> <empuctor-arg> <props> <prop key = "kaptcha.border"> 예 </prop> <prop key = "kaptcha.border.color"> 105,179,90 </prop> <proplcha = "kaptcha. <prop key = "kaptcha.image.width"> 125 </prop> <prop key = "kaptcha.image.height"> 45 </prop> <prop key = "kaptcha.textproducer.font.size"> 45 </prop> <prop key = "kaptcha.session.key"> code </prop> <prop key = "kaptcha.textProducer.char.length"> 4 </prop> <prop key = "kaptcha.textProducer.font.names"> Song Font, Kaiyi, Microsoft yahei </prop> </props> </pructuctor-arg> </bean> </bean>

참고 :이 Bean은 일부 검증 코드 속성으로 구성되며 Spring-web.xml로 직접 작성할 수도 있습니다. 개인 습관에 따르면, 나는 다른 파일에 다른 모듈의 구성을 작성하고 싶습니다.

2. 검증 코드를 생성 할 새 컨트롤러를 만듭니다

CodeController.java

 @ControllerPublic 클래스 CodeController {@autowired 개인 프로듀서 Captchaproducer = null; @requestmapping ( "/kaptcha") public void getKaptchaimage (httpservletrequest 요청, httpservletresponse 응답)는 예외 {httpsession session = requestsession (); response.setDateHeader ( "만료", 0); response.setHeader ( "캐시 제어", "무자개, 없음, 캐시가 없음, 꼭 봐야 할 반복"); response.addheader ( "캐시 제어", "post-check = 0, pre-Check = 0"); Response.SetHeader ( "Pragma", "No-Cache"); Response.setContentType ( "image/jpeg"); // 검증 코드 생성 문자열 captext = captchaproducer.createtext (); session.setattribute (constants.kaptcha_session_key, captext); // 클라이언트에 bufferedImage를 쓰기 bi = captchaproducer.createimage (captext); servletoutputStream out = response.getOutputStream (); imageio.write (bi, "jpg", out); {out.flush (); } 마침내 {out.close (); }}}

참고 :이 컨트롤러의 경로는 "Kaptcha"이므로 프론트 엔드 검증 코드의 SRC는 Kaptcha.jpg입니다.

3. 검증 코드를 비교하기 위해 새 공구 클래스를 만듭니다.

Codeutil.java

 공개 클래스 CodeUtil { / ** * 획득 한 프론트 엔드 매개 변수를 문자열 유형으로 변환 * @param key * @param key * @return * / public static string getstring (httpservletrequest request, String key) {try {string result = request.getParameter (키); if (result! = null) {result = result.trim (); } if ( "". Equals (result)) {result = null; } 반환 결과; } catch (예외 e) {return null; }} /** * 검증 코드 확인 * @param request * @return * /public static boolean checkverifycode (httpservletrequest request) {// 생성 된 검증 코드를 가져옵니다. // 사용자 문자열에서 입력 한 확인 코드를 가져옵니다. verifyCodeActual = codeUtil.getString (요청, "verifyCodeActual"); if (verifycodeactual == null ||! verifycodeactual.equals (verifycodeexpected)) {return false; } true를 반환합니다. }}

참고 : Get Here에 의해 전달되는 매개 변수를 "verifycodeactual"이라고하므로 페이지의 확인 코드의 이름 값도 다음과 같습니다.

다음으로 확인 코드를 사용할 수 있습니다!

4. 사용자 로그인 용 컨트롤러

Usercontroller.java

 @controller @requestmapping ( "/user") public class usercontroller {@autowired private userervice userervice; @requestmapping ( "/login") public String login (@requestparam ( "username") 문자열 사용자 이름, @requestparam ( "password") 문자열 암호, httpservletrequest 요청) {boolean result = userervice.login (username, password); if (! codeUtil.checkverifyCode (request)) {request.setAttribute ( "CodeERR", "verification code is signcrect!"); "실패"를 반환합니다. } else {if (result) {request.setAttribute ( "사용자", 사용자 이름); "성공"을 반환합니다. } else {request.setAttribute ( "errmsg", "사용자 이름 또는 비밀번호의 오류!"); "실패"를 반환합니다. }}}}

참고 : 여기에서 입력 한 검증 코드가 올바른지 비교하기 위해 CodeUtil 도구를 호출합니다.

5. 프론트 엔드 페이지

login.jsp

 <%@ page language = "java"import = "java.util.*"contenttype = "text/html; charset = utf-8"pageencoding = "utf-8"%> <! doctype html public "-// w3c // dtd html 4.01 Transitional // en" "http://www.w3.org/tr/tr/html4/loose.dtd"> <html> <head> <title> login </title> <script type = "text/javaScript"> function refresh () {document.getElementById ( 'captcha_img'). "kaptcha.jpg?" } < /script> < /head> <body> <form action = "$ {pagecontext.request.contextpath} /user /login"method = "post"> username : <input type = "text"name = "username" /> <br /> 암호 : <input type = "password"name = "password" "inter el 코드 "이름 ="verifycodeactual "> <div> <img id ="captcha_img "onclick ="refresh () "src ="src = "kaptcha.jpg"/> </div> <입력 유형 = "value ="login "/> </form> </body> </html>

성공 .JSP

 <hod> <h1> 로그인에 오신 것을 환영합니다. $ {user} </h1> </body>

실패 jsp

 <body> 죄송합니다, 로그인 실패, 이유 : <br> $ {codeerr} <h2> $ {errmsg} </h2> </body>

참고 : JS Code of Login.jsp는 "Click to Change"기능을 완료하는 것입니다. 확인 코드의 이름은 공구 클래스에서 전달 된 이름과 동일해야하며 SRC는 확인 코드와 .jpg를 생성하는 컨트롤러 경로입니다.

6. 테스트 :

올바른 검증 코드를 입력하십시오.

성공적으로 로그인 :

잘못된 검증 코드를 입력하십시오.

확인 코드가 페이지에 잘못 표시됩니다.

확인 코드를 클릭하여 변경하십시오!

방법 2 : web.xml에서 확인 코드를 구성합니다

방법 1과 비교하여 하나의 증가 및 두 가지 감소.

줄이다:

1. 위 프로젝트를 기반으로 CodeController.java를 삭제하십시오 .

2. Spring-Kaptcha.xml을 삭제 하고 다른 사람들을 유지하십시오.

증가하다:

1. web.xml 에 다음 구성을 추가하십시오 .

 <!-검증 코드-> <servlet> <servlet-name> kaptcha </servlet-name> <servlet-class> com.google.code.kaptcha.servlet.kaptchaservlet </servlet-class> <!-<init-param> <param-name> kaptcha.border </param-name> </init-param> <!-글꼴 색상-> <init-param> <param-name> kaptcha.textProducer.font.color </param-name> <param- value> </param- value> </init-param> <!-이미지 너비-> <init-param> <param-name> kaptcha.image.width </param-name> <Param-value> 135 </param-value> </init-param> <!-검증 코드를 생성하는 데 사용하는 문자-> <apel-param> <param-name> kaptcha.textProducer.char.string </param-name> <apar-value> acdefhkprstwx345679 </initim-varam> <! <init-param> <param-name> kaptcha.image.height </param-name> <param-value> 50 </param- value> </init-param> <!-글꼴 크기-> <init-param> <param-name> kaptcha.textProducer.font.size </regar-value> 43 </param-val-value> <!-간섭선-> <init-param> <param-name> kaptcha.noise.color </param-name> <param- value> red </param-value> </init-param> <!-문자 수-> <init-param> <param-name> kaptcha.textProducer.length </param-name> <param-name> </init-param> <!-font-> <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.jpg </url-pattern> </servlet-mapping>

참고 :이 구성은 확인 코드를 구성하는 데 사용됩니다. 마지막 <url-pattern>/kaptcha.jpg</url-pattern> 은 확인 코드에서 src = "kaptcha.jpg" 에 해당해야합니다.

이렇게하면 확인 코드의 구성이 완료된 다음 테스트합니다. 시험:

잘못된 검증 코드를 입력하십시오.

페이지에는 확인 코드 오류가 표시됩니다.

올바른 검증 코드를 입력하십시오.

성공적으로 로그인 :

테스트가 통과되었습니다!

요약 :

1. 페이지에 확인 코드를 추가하는 것은 매우 간단합니다. <img src= "xx"> 를 추가하십시오. IMG 태그를 사용한 다음 SRC Plus .JPG 를 통해 확인 코드를 생성하는 컨트롤러 경로를 가리 키거나 SRC를 통해 컨트롤러를 가리 킵니다.

<url-pattern>/kaptcha.jpg</url-pattern> , 즉 src="kaptcha.jpg" .

2. 교체를 클릭하는 것도 간단합니다. IMG 태그에 onclick 이벤트를 추가 한 다음 JS로 완료하십시오.

JS를 변경하려면 클릭하십시오.

 <script type = "text/javaScript"> function refresh () {document.getElementById ( 'captcha_img'). src = "kaptcha.jpg?"+math.random (); } </스크립트>

그런 다음 onclick="refresh()" IMG 태그에 추가하여 클릭 이벤트를 완료합니다.

3. More Kaptcha 속성 구성

위의 내용은 개인 메모를 편집 한 것입니다. 오류가 있으면 나를 비판하고 수정하는 것을 환영합니다!