작업 환경

eGovFramework Version : 3.8

Eclipse Version : Oxygen.3a Release (4.7.3a)

JDK Version : 1.8

 

전자정부 프레임워크에 기본적으로 적용되어 있는 웹에디터가 있는데 이것이 ckeditor 입니다물론 처음부터 바로 사용할 수 있도록 되어 있는것은 아니고 프로그램 내에 포함은 되어 있는데 개발자가 다른 웹에디터를 적용할 수도 있기 때문에 ckeditor가 기본으로 설정이 되어 있지는 않고 사용을 하려면 조금 손을 봐야 합니다.

처음 게시판에 글을 쓰려고 하면 나오는 화면이 아래와 같이 일반 텍스트 모드의 입력 폼이 나타 납니다.


전자정부 프레임워크 ckeditor



1. ckeditor lib 폴더복사

내용 입력 부분에 ckeditor를 포함하도록 하려면 ckeditor 라이브러리가 있어야 합니다.  egovframework template project에서 common all-in-one 프로젝트를 설치 하거나


전자정부 프레임워크 ckeditor


all-in-one 압축파일을 해제 합니다

그리고 /src/main/webapp/html/egovframework/com/cmm/utl/ckeditor 폴더를 찾습니다.


전자정부 프레임워크 ckeditor

 

ckeditor 폴더를 개발 프로젝트의 동일한 위치로 복사해 놓습니다.

 

2. pom.xml 설정 확인

 

pom.xml에 다음과 같이 dependency가 설정 되어 있는지 확인합니다.

기본적으로 설정이 되어있는데 없다면 추가해주면 됩니다.

        <dependency>

            <groupId>com.ckeditor</groupId>

            <artifactId>ckeditor-java-core</artifactId>

            <version>3.5.3</version>

        </dependency>

 


3. jsp 파일 수정

이제 게시판에 사용되는 jsp 파일을 수정 합니다.

/프로젝트명/src/main/webapp/WEB-INF/jsp/egovframework/com/cop/bbs/EgovArticleRegist.jsp

기본적으로 ckeditor 관련 설정들이 jsp 파일에 포함되어 있습니다.

<script type="text/javascript" src="<c:url value='/html/egovframework/com/cmm/utl/ckeditor/ckeditor.js?t=B37D54V'/>" ></script>

 

var ckeditor_config = {

                  //filebrowserImageUploadUrl: '${pageContext.request.contextPath}/utl/wed/insertImageCk.do', // 파일 업로드를 처리 경로 설정.

                  filebrowserImageUploadUrl: '${pageContext.request.contextPath}/ckUploadImage', // 파일 업로드를 처리 경로 설정(CK필터).

         };

         CKEDITOR.replace('nttCn',ckeditor_config);

 

CKEDITOR.instances.nttCn.updateElement();

 

여기에 추가적인 작업을 해줘야 사용이 가능 합니다.

먼저 상단 taglib들이 있는 곳에 ckeditor taglib를 추가해 줍니다.

 

<%@ taglib prefix="ckeditor" uri="http://ckeditor.com" %>

 

 

글 내용 부분에 ckeditor 를 추가 합니다.  처음에는 ckeditor내용 없이 되어 있습니다.

<!-- 내용  -->

<c:set var="title"><spring:message code="comCopBbs.articleVO.regist.nttCn"/> </c:set>

<tr>

         <th><label for="nttCn">${title } <span class="pilsu">*</span></label></th>

         <td class="nopd" colspan="3">

                  <form:textarea path="nttCn" title="${title} ${inputTxt}" cols="300" rows="20" />  

           ============================ CKeditor 관련 추가 ============================

                  <div><form:errors path="nttCn" cssClass="error" /></div> 

         </td>

</tr>


여기에 하단처럼 한줄을 추가 합니다.

<!-- 내용  -->

<c:set var="title"><spring:message code="comCopBbs.articleVO.regist.nttCn"/> </c:set>

<tr>

         <th><label for="nttCn">${title } <span class="pilsu">*</span></label></th>

         <td class="nopd" colspan="3">

                  <form:textarea path="nttCn" title="${title} ${inputTxt}" cols="300" rows="20" />  

                  <ckeditor:replace replace="nttCn" basePath="${pageContext.request.contextPath}/html/egovframework/com/cmm/utl/ckeditor/" />

                  <div><form:errors path="nttCn" cssClass="error" /></div> 

         </td>

</tr>

 

이제 화면을 새로고침 하고 다시 입력화면을 클릭하면


전자정부 프레임워크 ckeditor


짜잔적용이 되었습니다.

ckeditor 폴더를 복사하고 jsp 파일에 두줄 추가하면 되는군요.


- copy coding -

작업 환경

eGovFramework Version : 3.8

Eclipse Version : Oxygen.3a Release (4.7.3a)

JDK Version : 1.8


 

1. 비밀번호 암호화 분석

 

단방향 암호화는 비밀번호와 같이 평문을 암호문으로 변경 가능 하지만 다시 평문으로 복호화를 할 수 없도록 하는 암호 알고리즘 입니다간략하게 소스를 살펴 보도록 하겠습니다.

로그인을 하게 되면 아이디와 비밀번호를 이용하여 로그인 처리를 하게 되는데 처리하는 모듈은 다음과 같습니다.


/CopyCoding/src/main/java/egovframework/com/uat/uia/service/impl/EgovLoginServiceImpl.java

@Override

         public LoginVO actionLogin(LoginVO vo) throws Exception {

 

          // 1. 입력한 비밀번호를 암호화한다.

                  String enpassword = EgovFileScrty.encryptPassword(vo.getPassword(), vo.getId());

          vo.setPassword(enpassword);

 

          // 2. 아이디와 암호화된 비밀번호가 DB 일치하는지 확인한다.

          LoginVO loginVO = loginDAO.actionLogin(vo);

 

          // 3. 결과를 리턴한다.

          if (loginVO != null && !loginVO.getId().equals("") && !loginVO.getPassword().equals("")) {

                  return loginVO;

          } else {

                  loginVO = new LoginVO();

          }

 

          return loginVO;

    }

소스에 있는 설명처럼 1번에서 비밀번호를 암호화 해서 enpassword에 받아오고 받아온 암호문을 2번에서 DB에 저장된 암호문과 비교를 하면 됩니다.

 

그럼 실제로 비밀번호를 암호화 하는 함수를 살펴보면

/common/src/main/java/egovframework/com/utl/sim/service/EgovFileScrty.java

/**

     * 비밀번호를 암호화하는 기능(복호화가 되면 안되므로 SHA-256 인코딩 방식 적용)

     *

     * @param password 암호화될 패스워드

     * @param id salt 사용될 사용자 ID 지정

     * @return

     * @throws Exception

     */

    public static String encryptPassword(String password, String id) throws Exception {

 

               if (password == null) return "";

               if (id == null) return ""; // KISA 보안약점 조치

              

               byte[] hashValue = null; // 해쉬값

       

               MessageDigest md = MessageDigest.getInstance("SHA-256");

              

               md.reset();

               md.update(id.getBytes());

              

               hashValue = md.digest(password.getBytes());

       

               return new String(Base64.encodeBase64(hashValue));

    }

id도 키 값으로 사용하여 암호화를 진행하고 리턴 해주고 있습니다.

 

2. 단방향 암호화 사용

 

비밀번호를 암호화 하는 모듈을 살펴보니 참 간단 합니다이제 이것을 이용하여 단방향 암호화 기능을 만들어 보겠습니다.

우선 Service를 적당히 만들어... 아니 그냥 써도 되고 대충 service class를 만들고 기존 소스를 복사해서 사용해도 됩니다.

 

저는 class를 만들어서 사용해 보았습니다.



egov passwd crypto


 

내용은 기존 소스를 복사했고요.

public class CryptoOnewayPasswd {

 

         /**

     * 비밀번호를 암호화하는 기능(복호화가 되면 안되므로 SHA-256 인코딩 방식 적용)

     *

     * @param password 암호화될 패스워드

     * @param id salt 사용될 사용자 ID 지정

     * @return

     * @throws Exception

     */

    public static String encryptPassword(String password, String id) throws Exception {

 

                  if (password == null) return "";

                  if (id == null) return ""; // KISA 보안약점 조치

                 

                  byte[] hashValue = null; // 해쉬값

        

                  MessageDigest md = MessageDigest.getInstance("SHA-256");

                 

                  md.reset();

                  md.update(id.getBytes());

                 

                  hashValue = md.digest(password.getBytes());

        

                  return new String(Base64.encodeBase64(hashValue));

    }

}

 

이제 서비스를 호출할 Controller를 하나 작성 합니다.


egov passwd crypto


Controller 내용도 별거 없고 모듈에 아이디와 비밀번호를 넘겨주고 암호화된 비밀번호를 받으면 됩니다. 


@Controller

public class CryptoOnewayPasswdController {

         private static final Logger LOGGER = LoggerFactory.getLogger(CryptoOnewayPasswdController.class);

        

         @Resource(name = "cryptoOnewayPasswd")

         private CryptoOnewayPasswd cryptoOnewayPasswd;

        

         @RequestMapping("/copycoding/cryptoOnewayPasswd.do")

         public String cryptoPasswd(ModelMap model) throws Exception {

                 

                  String id= "copycoding";

                  String password = "copy!@#$";

                  String enCryptPasswd = cryptoOnewayPasswd.encryptPassword(password, id);

                 

                  LOGGER.info(enCryptPasswd);

                  return null;

         }

 

}

 

결과

String id= "copycoding";

String password = "copy!@#$";

비밀번호를 암호화 하고 결과를 로그에 출력하였습니다

[log4j]2019-09-28 17:49:25,749  INFO [copycoding.com.util.crypto.web.CryptoOnewayPasswdController] r639j2srhlNLZTGU7MR02JzILbBi5X5wOHlmLqPtjks=

 

단방향 암호화가 필요하면 이런식으로 생성하면 됩니다.


 

3. 전체 소스


- Service

package copycoding.com.util.crypto.service;

 

import java.security.MessageDigest;

 

import org.apache.commons.codec.binary.Base64;

import org.springframework.stereotype.Service;

 

@Service("cryptoOnewayPasswd")

public class CryptoOnewayPasswd {

 

         /**

     * 비밀번호를 암호화하는 기능(복호화가 되면 안되므로 SHA-256 인코딩 방식 적용)

     *

     * @param password 암호화될 패스워드

     * @param id salt 사용될 사용자 ID 지정

     * @return

     * @throws Exception

     */

    public static String encryptPassword(String password, String id) throws Exception {

 

                  if (password == null) return "";

                  if (id == null) return ""; // KISA 보안약점 조치

                 

                  byte[] hashValue = null; // 해쉬값

        

                  MessageDigest md = MessageDigest.getInstance("SHA-256");

                 

                  md.reset();

                  md.update(id.getBytes());

                 

                  hashValue = md.digest(password.getBytes());

        

                  return new String(Base64.encodeBase64(hashValue));

    }

}

 

 

- Controller

package copycoding.com.util.crypto.web;

 

import javax.annotation.Resource;

 

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;

import org.springframework.stereotype.Controller;

import org.springframework.ui.ModelMap;

import org.springframework.web.bind.annotation.RequestMapping;

 

import copycoding.com.util.crypto.service.CryptoOnewayPasswd;

 

@Controller

public class CryptoOnewayPasswdController {

         private static final Logger LOGGER = LoggerFactory.getLogger(CryptoOnewayPasswdController.class);

        

         @Resource(name = "cryptoOnewayPasswd")

         private CryptoOnewayPasswd cryptoOnewayPasswd;

        

         @RequestMapping("/copycoding/cryptoOnewayPasswd.do")

         public String cryptoPasswd(ModelMap model) throws Exception {

                 

                  String id= "copycoding";

                  String password = "copy!@#$";

                  String enCryptPasswd = cryptoOnewayPasswd.encryptPassword(password, id);

                 

                  LOGGER.info(enCryptPasswd);

                  return null;

         }

 

}

 

 

 - copy coding -

작업 환경

eGovFramework Version : 3.8

Eclipse Version : Oxygen.3a Release (4.7.3a)

JDK Version : 1.8

 

데이터의 validator는 화면에서 입력한 데이터를 Server로 보내기 전 검증과 Server에서는 받은 데이터를 처리하기 전의 검증으로 나뉘어 집니다.  뭏론 화면에서 javascript로 파라미터를 하나씩 검증하는 방법을 사용하기도 하지만 작업이 어렵지 않으니 한번 사용해 봅니다.

작업도 간단합니다. jsp, xml, Vo, Controller만 작성해 주면 됩니다.

 

Vo 작성

service 패키지를 만들고 vo를 생성하여 입력 받을 데이터들을 설정 합니다

 

public class ValidatorTestVo {

 

         private String id;

         private String name;

         private int age;

        

        

         public String getId() {

                  return id;

         }

         public void setId(String id) {

                  this.id = id;

         }

         public String getName() {

                  return name;

         }

         public void setName(String name) {

                  this.name = name;

         }

         public int getAge() {

                  return age;

         }

         public void setAge(int age) {

                  this.age = age;

         }

 

}

 

validator xml 작성

 

resource 폴더 validator에 임의의 폴더를 생성 합니다.  물론 기존 폴더에 xml만 추가해도 됩니다.

생성한 폴더에 임의의 xml 파일을 생성 합니다. 여기서는 다음과 같이 폴더와 파일을 생성 했습니다.

ValidateTest.xml 파일에 검사할 항목들을 추가 합니다.

<form-validation>

 

    <formset>

                  <form name="validatorTestVo">

                           <field property="id" depends="required">

                   <arg0 key="아이디" resource="true"/>

                           </field>

                           <field property="name" depends="required">

                   <arg0 key="이름" resource="true"/>

                           </field>

                           <field property="age" depends="required, integer">

                   <arg0 key="나이" resource="true"/>

                           </field>

                  </form>

    </formset>

 

</form-validation>

 

Controller 생성

 

web 패키지를 생성하고 Controller를 만듭니다.

 

@Controller

public class ValidatorTestController {

 

         @Autowired

         private DefaultBeanValidator beanValidator;

 

         @RequestMapping("/validator/validatorTest.do")

         public String index(ModelMap model) {

                  return "copycoding/validator/ValidatorTest";

         }

        

         @RequestMapping("/validator/formValidate.do")

         public@ResponseBody String selectGridSampleList(@ModelAttribute("validatorTestVo") ValidatorTestVo validatorTestVo, BindingResult bindingResult, ModelMap model) throws Exception {

                 

                  beanValidator.validate(validatorTestVo, bindingResult); // validation 체크를 수행하여 검사        

                 

          if (bindingResult.hasErrors()) {

                  model.addAttribute("validatorTestVo", validatorTestVo); // validation 오류 발생한 경우 리턴 처리

                           return "";

                  }

                 

                  return null;

         }

}

 

JSP 파일 생성

 

이제 마지막으로 화면을 위한 폴더와 파일을 생성 합니다.

 

egovframework validator

 

 

상단에 validatorlib를 추가 합니다.

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<script type="text/javascript" src="<c:url value="/validator.do"/>"></script>

<%@ taglib prefix="validator" uri="http://www.springmodules.org/tags/commons-validator" %>

 

validatorjavascript도 추가를 해줍니다.

<validator:javascript formName="validatorTestVo" staticJavascript="false" xhtml="true" cdata="false"/>

 

<script type="text/javaScript" language="javascript">

function fncValidatorInsert() {

 

    var varFrom = document.getElementById("validatorTestVo");

    varFrom.action = "<c:url value='/validator/formValidate.do'/>";

 

    if(confirm("저장 하나요?")){

        if(!validateValidatorTestVo(varFrom)){

            return;

        }else{

            if(ipValidate())

                varFrom.submit();

            else

                return;

        }

    }

}

</script>

 

validatorform을 다음과 같이 작성 합니다.

<form:form commandName="validatorTestVo" method="post" action="${pageContext.request.contextPath}/validator/formValidate.do' />">

<table class="wTable">

         <tr>

                  <td><input id="id" name="id" type="text"></td>

         </tr>

         <tr>

                  <td><input id="name" name="name" type="text"></td>

         </tr>

         <tr>

                  <td><input id="age" name="age" type="text"></td>

         </tr>

         <tr>

                  <td><input class="s_submit" type="submit" value="save" onclick="fncValidatorInsert(); return false;" /></td>

         </tr>

</table>

</form:form>

 

테스트를 진행

 

먼저 아무것도 입력하지 않고 저장 버튼을 클릭 하는 경우

egovframework validator

 

모두 필수 값이므로 입력을 하도록 메시지가 출력 됩니다.

 

모두 문자를 입력한 경우

 

egovframework validator

 

age는 숫자 이므로 숫자 입력 메시지가 출력 됩니다.

좀더 상세한 설정이 필요하면 validatorxml을 설정하면 됩니다.

 

- copy coding -


요즘 사용하는 편집기들은 폰트 크기 조절은 간단하게 Ctrl+마우스휠로 간단하게 크기를 조절 하도록 되어 있는데 eclipse는 아직도 설정을 통해서만 글자 크기를 조절 하도록 되어 있습니다그러다 보니 가끔 방법이 생각나지 않을 때가 있습니다작업은 단순 합니다.

 

1. 설정을 통한 변경

 

먼저 Window 메뉴에서 Preferences 를 선택 합니다.


eclipse font 변경


좌측 메뉴에서 General을 확장 하고 다시 Appearance를 확장하여 Colors and Fonts를 선택 합니다.


eclipse font 변경



우측 화면은 버전에 따라 조금 다를 수 있지만 어째든 원하는 언어를 확장 하여 Editor Text Font를 선택 하고 우측 상단 Edit 버튼을 클릭 합니다.


eclipse font 변경


원하는 글꼴과 크기를 선택 하여 적용하면 됩니다.


eclipse font 변경


. 너무 크게 했군요. 적당히 수정 합니다.

위쪽에서 Preferences 창을 보고 알았겠지만 폰트 크기를 변경하면 모두 바뀌는게 아니고 javajava대로 javascriptjavascript대로 각각 설정을 해야 합니다.

 

javascript를 수정하려면 이런식으로 동일한 작업을 해야 합니다.


eclipse font 변경



2. 단축키 이용 변경

 

단축키를 이용하면 폰트 자체는 변경이 되지 않고 크기만 변경이 가능 합니다.

 

2.1 메인 키패드 ‘+’, ‘-‘ 사용


자판위에 있는 ‘+’ 키와 ‘-‘ 키를 이용하는 방법은 Ctrl 키와 같이 사용하면 됩니다.

Ctrl + ‘+’ : 글자 크기 확대

Ctrl + ‘-‘ : 글자 크기 축소

 

2.2 숫자 키패드 ‘+’, ‘-‘ 사용


숫자키와 같이 있는 ‘+’ 키와 ‘-‘ 키를 이용할때는 Ctrl 키와 Shift 키를 같이 사용하면 됩니다.

Ctrl + Shift + ‘+’ : 글자 크기 확대

Ctrl + Shift + ‘-‘ : 글자 크기 축소


- copy coding -


12345678

+ Recent posts