반응형

프레임워크(스프링) 구축시 자주 볼 수 있는 한글 처리와 에러 메세지


작업을 하다보면 종종 볼수 있는 메세지를 정리해 봅니다. 

에러 메세지를 볼때면 자주 찾아 보게 되는데 찾아 봤던것이 기억나지 않는 경우도 종종 있다 보니 따로 정리를 좀 해보았습니다. 

프로그래 밍을 하고 싹 돌려봤을때 에러 없이 딱 작동이 되는 그때의 그기분은 참 짜릿합니다.

그런데 테스트를 하는데 딱 하고 에러 메세지가 나오면 한심하기도 하고 순간 짜증이 많이 날때가 많습니다. 

그런데도 불구하고 비슷한 실수를 많이 합니다.  주의 사항이라고 할 수도 있게 몇 가지를 정리해 봣습니다.  


1. 한글이 깨지는 경우 처리 방법


한글 깨짐은 에러는 아니지만 get방식으로 request할 때 한글 깨지는 문제 처리 방법이다.

클라이언트 측 : jQuery에서 한글로된 인자를 넘길 때 encodeURI(encodeURIComponent(value))로 넘긴다.

서버 측 : Controller에서 한글 인자를 받을 때 URLDecoder.decoded(value)로 처리해준다.



2. Invalid bound Statement (not found): Mapper.function


요것도 메시지를 눈여겨 보면 답이 나온다.

문장과 Mapper의 함수가 연결이 안된다는 이야기의 오류 이다. 

바로 Mapper.xml에 있는 쿼리 id와 Mapper.java에 있는 메소드 명이 달라서 발생한 문제다.



3. Mapped Statemets collection already contains value for...

톰캣을 기동하는데 이런 메시지가 나오면서 디플로이가 제대로 안된다면

Mapper에 중복된 설정이 있거나 id명을 실수해서 썼거나 했을 경우가 많습니다. 

특정 Mapper의 Query문 mapping이 잘 안되었을 경우 볼수 있는 오류 입니다.

MyBatis 쿼리 설정 상의 문제 또는 Mapper와 Query 호출 부분이나 쿼리를 테스트 해 보아야 합니다.



4. requestmappinghandlermapping did not find handler method for


요건 메시지 내용대로 request에 대한 mapping이 잘못되어 요청한 리소스를 찾을 수 없다는 뜻이다.

요런 것이 참 별것도 아니면서 시간 잡아먹는 하마다.

문제의 원인은 엉뚱하게 오타나 다른 request parameter를 값을 호출 해놓고는 호출 시 다른 paramater를 호출한 경우 이다.

반응형
반응형

[Jquery / Javascript / Json / AJAX] 자바스크립트를 이용하여 현재일자를 특정일자과 비교하여 페이지 이동하는 방법

자바스크립트로 Date개체를 사용하는 경우가 많습니다. 

Date 개체는 현재 보고 있는 컴퓨터 시간을 참조합니다.

즉 서버 시간이 아닌 사용하는 컴퓨터 시간을 확인 하는 겁니다.

이것은 자바스크립트가 서버언어가 아닌 클라이언트(사용자PC)에서 로드 되는 특성때문입니다.

그렇기 때문에 상대적으로 시간이 틀릴 수가 있습니다. 

수동으로 개인 PC시간을 변경하면 그값을 그대로 가져오는 것을 확인 할 수 있습니다. 

자바스크립트 자체로만으로는 서버시간을 표시하는 것은 할 수 없다는 이야기가 됩니다. 

java를 사용하면 서버에서 기동을 하는 언어이기 때문에 바로 가져 올수 있지만 java를 사용할 수 없는 경우에는

여기에 필요한것은 서버의 시간을 가져올 중간 매개체가 필요합니다.

그 매개체는 XMLHttpRequest 개체를 사용합니다. 

XMLHttpRequest 개체는 클라이언트와 서버 중간에서 요청과 결과를 전달하는 역활을 합니다. 

다만 XMLHttpRequst 개체는 웹 표준은 아닙니다. 

하지만 현재는 거의 모든 웹브라우저에서 지원하고 있습니다. 


JSON /chk/systemcheck.js 파일 데이터 내용

--------------------------------------------------------------------------------------

{

 "openyn":"Y"

,"startdaytime":"2018.09.28 18:00"

,"enddaytime":"2018.10.01 11:00"

,"syschkUri":"/systemCheck.html"

,"noticetxt":"스타필드 앱의 안정적인 사용을 위해

              \n시스템 점검을 진행하고 있습니다.

              \n이용에 불편함을 드린점 양해 부탁드립니다."

}

--------------------------------------------------------------------------------------

자바스크립트

--------------------------------------------------------------------------------------

$(document).ready(function() {   

        var st = srvTime();

        var today = new Date(st); // 현재시간

        console.log("http",today);

        $.getJSON("/chk/systemcheck.js", function(data){

            var openyn = data["openyn"];

            var startdaytime = new Date(data["startdaytime"]);

            var enddaytime = new Date(data["enddaytime"]);

            var noticetxt = data["noticetxt"];

            if(openyn == 'Y'){

                if(startdaytime<today && today<enddaytime){

                    location.href = data["syschkUri"]; 

                }

            }

        });

    });

    

    // 서버 시간 get

    var xmlHttp;

    function srvTime(){

        if(window.XMLHttpRequest){//분기 하지 않으면 IE에서만 작종

            xmlHttp = new XMLHttpRequest(); // IE 7.0 이상, 크롬, 파이어폭스 등 작동

            xmlHttp.open('HEAD',window.location.href.toString(),false);

            xmlHttp.setRequestHeader("Content-Type", "text/html");

            xmlHttp.send('');

            return xmlHttp.getResponseHeader("Date");

        }else if (window.ActiveXObject) { // 윈도우 IE 버전이 4,5,6 이라면 

            xmlHttp = new ActiveXObject('Msxml2.XMLHTTP');

            xmlHttp.open('HEAD',window.location.href.toString(),false);

            xmlHttp.setRequestHeader("Content-Type", "text/html");

            xmlHttp.send('');

            return xmlHttp.getResponseHeader("Date");

        }

    }

--------------------------------------------------------------------------------------


자바스크립트로 srvTime() 함수를 생성합니다. 

srvTime() 함수는 XMLHttpRequest를 이용해서 HEAD에서 서버시간을 추출하는 함수 입니다. 

$(document).ready(function() {..}  는 페이지 호출을 하면 자동으로 실행되는 자바스크립트 함수 입니다. 

이 함수 안에서  서버시간을 추출해서 var today = new Date(st); 비교할 현재 시간 객체를 생성합니다. 

$.getJSON("/chk/systemcheck.js", function(data){..} 는 /chk/systemcheck.js 위치에 있는 JSON 파일을 읽어 객체 화 할수 있도록 합니다.

var openyn = data["openyn"]; 는 json 파일 데이터 중에 openyn키 값을 openyn 객체에 넣습니다. 

var startdaytime = new Date(data["startdaytime"]); 위와 마찬가지고 비교할 startdaytime 객체에 startdaytime 키값을 date 형식으로 넣습니다. 

if(startdaytime<today && today<enddaytime){..} 생성된 날짜 객체들을 비교합니다. 

비교값이 참일 경우 location.href = data["syschkUri"]; 실행이 되며 syschkUri키값인 /systemCheck.html 페이지로 이동을 합니다. 


감사합니다. 고맙습니다. 운이 좋습니다. 

반응형
반응형

[jQuery] datepicker 사용 / 미사용 설정 (enabled,disabled)

달력 플러그인 중에 datepicker를 많이들 사용하고 있습니다. 
Calendar plug-ins many use 'datepickers'

달력기능을 수동으로 켜고 끌수 있는 방법이 있습니다. 
You can manually turn the calendar feature on and off.

방법은 다음과 같습니다. 
Look down.

[ datepicker 끄기(off) ]

 $(selector).datepicker('option','disabled',true);


ex) class="datepicker"

 $('.datepicker').datepicker('option','disabled',true);

 [ datepicker 켜기(on) ]

 $(selector).datepicker('option','disabled',false);


ex) class="datepicker"

 $('.datepicker').datepicker('option','disabled',false);





반응형
반응형

jQuery closest(), parents() 메소드의 차이

일전에 jQuery 관련 코딩을 할때에는 closest() 메소드의 존재를 몰랐습니다.

그래서 parents() 메소드를 사용하곤 했었는데 불편했던 점 중에 하나가 parens() 메소드의 경우는 자신부터 document root 까지 검색을 하기 때문에 검색 결과가 1개 이상일 수 있다는 점이었습니다.

그래서 꼭 parents("tr")[0] 뭐 이런식으로 사용하곤 했습니다.

하지만 closest 를 사용하면 closest("tr") 로 바로 사용하면 됩니다. 왜냐하면 closest() 메소드는 단 하나의 결과만을 리턴하기 때문이죠

아래의 코드를 보면 이해가 쉬울 거라 생각됩니다.


<ul id="one" class="level-1">

  <li class="item-i">I</li>

  <li id="ii" class="item-ii">II

  <ul class="level-2">

    <li class="item-a">A</li>

    <li class="item-b">B

      <ul class="level-3">

        <li class="item-1">1</li>

        <li class="item-2">2</li>

        <li class="item-3">3</li>

      </ul>

    </li>

    <li class="item-c">C</li>

  </ul>

  </li>

  <li class="item-iii">III</li>

</ul>

$("li.item-a").closest("ul").css("background-color", "red");


closest 의 경우에는 item-a 엘리멘트의 가장가까운 level-2 만 배경색이 변경됩니다.

$("li.item-a").parents("ul").css("background-color", "red");

parents 의 경우에는 item-a 엘리멘트의 모든 부모 ul 엘리멘트의 배경색이 변경됩니다.

따라서 첫 번째 부모 엘리멘트를 찾고 싶은경우에는 closest 를 사용하면 쉽게 코딩이 가능하리라 생각됩니다.

참고

http://api.jquery.com/closest/




반응형

+ Recent posts