FRONT

    JS 타이머 함수

    JS 내장함수인 타이머 함수이다. setTimeout(함수, 시간) 일정 시간 후 함수 실행 setInterval(함수, 시간) 일정 시간 간격으로 함수 반복 실행 clearTimeout(id) 실행되고 있는 timeout 을 중지 clearInterval(id) 실행되고 있는 interval 을 중지 EX) function hello() { alert('hello'); } //hello 함수를 1초뒤 한번만 실행 setTimeout(hello, 1000); //hello 함수를 1초마다 실행 setInterval(hello, 1000); 주의! 함수를 넣을때 hello() 가 아닌 함수명만을 넣어줘야 한다.

    타임리프 js에서 model 데이터 받기 ( th:inline )

    현재 타임리프를 사용하고 있지만, 전에는 jsp를 사용했었다. 컨트롤러에서 model을 사용해 프론트로 데이터를 보내면 key값을 이용해 ${key} 이런식으로 값을 가져올 수 있었고, js에서도 마찬가지였다. 그런데 이번에 타임리프를 사용하면서 jsp와 거의 유사한 방식으로 인해 사용해 어려움을 느끼진 않았는데, 항상 데이터를 받을때 th속성을 이용해야 한다는 것이 꽤나 불편했다. 특히 이런식으로, [[ ]] 를 붙어주면 된다. ** 타임리프에서 세션값을 가져오기 위해선 jsp와 다르게 앞에 session. 을 붙여야 한다.

    JS new Date() 와  input date 의  날짜 비교

    JS new Date() 와 input date 의 날짜 비교

    태그의 date 타입을 document.getElementById().value 로 값을 가져오면 yyyy-mm-dd 의 형태로 값을 가져온다. js의 new Date() 함수를 사용해서 현재시간을 구하면 yyyy-mm-dd 형식이 아닌 다른 형식으로 date값이 저장된다. 때문에 의 값을 가져와서 js의 new Date()와 비교하기 위해선 파싱을 해줄 필요가 있겠다. function getFormatDate(date){ var year = date.getFullYear(); //yyyy var month = (1 + date.getMonth()); //M month = month >= 10 ? month : '0' + month; //month 두자리로 저장 var day = date.getDate(..

    ajax - 날짜(Date) 받아오기 , Date값을 String값으로 변환

    ajax - 날짜(Date) 받아오기 , Date값을 String값으로 변환

    댓글 작성 구현 중 댓글 내용, 작성자 는 모두 값을 잘 받아오나 날짜를 알려주는 Date타입의 값이 제대로 넘어오지 않음. Date타입은 ajax에서 읽을 수 없다고 한다. 해결 : @JsonFormat(shape=JsonFormat.Shape.STRING, pattern="yyyy-MM-dd") 쿼리에서 값을 받는 VO에서 date타입을 스트링 형태로 변환해서 ajax에서 사용. public class ReplyVO { private int bno; private int rno; private String content; private String writer; @JsonFormat(shape=JsonFormat.Shape.STRING, pattern="yyyy-MM-dd") private Date ..

    ajax post()함수로 jsp파일 로드(POST)

    welcome.jsp 환영합니다. 님 환영합니다. ${param.username}님 //post()함수 방식으로 jsp파일로드하는방식 (주석부분) ajax로 jsp파일 로드하기 이름을 입력하세요 : 결과: 환영합니다 [입력한 이름] 님 환영합니다 [입력한 이름] 님 같은 결과가 두번 출력된다. type : post를 submit해서 jsp파일에서 requestParameter 나 param.username으로 이름을 비동기 방식으로 받을 수 있다.

    ajax에 대하여 -$.load(), JSON파일,XML파일,JS파일 예제 (GET)

    * Ajax (Asynchronous JavaScript + XML) JavaScript와 XML을 이용한 비동기 통신처리를 구현하는 기술 -> JavaScript로 웹 페이지 전체를 다시 읽어 들이지 않고 서버와 데이터를 주고 받는 경우에 사용함. JavaScript를 이용해서 서버에서 데이터를 가져와 페이지 전체의 갱신(refresh)없이 특정 부분만을 변경하는 것이 가능합니다. 이러한 처리를 가능하도록 하는 것이 Ajax입니다. 웹브라우저는 웹페이지를 표시하기 위해 서버로부터 HTML파일을 가져와서 HTML을 해석한 후 화면에 뿌려줍니다. 예를들어 유저가 새로운 정보를 가져와 웹 페이지 전체를 갱신 합니다. 이러한 프로세싱 과정, 즉 브라우저가 서버로부터 HTML을 읽어 들이고 해석하여 화면에 표시..

    <c:out>을 사용하는 이유

    jsp를 이용해서 뷰페이지를 작성하는 와중 ${} 앞에 이 들어가는 이유가 궁금해졌다.넣지않고 코드를 작성해도 그대로 동작하는데 왜 사용하는 것 일까? 이유는, 보안성 관련이 크다 정보처리기사시험에서 본 XXS(Cross site Scripting) 크로스 사이트 스크랩핑 이라는 웹사이트에 스크립트 코드를 주입시켜서 웹사이트를 공격하는 방법인데, html코드를 해석하지 않게 만들어 방어하기위해 c:out을 사용하는 것이였다. 이게 무슨뜻이냐면 게시판을 구현해서 게시판에 글을 등록할때, 제목에 안녕하세요 를 작성할때 이런식으로 js를 넣으면 자바스크립트 코드가 실행된다.. 그래서 출력 문자열에 HTML 특수문자(예: , &, ' 또는 ") 포함되어 있을 경우 HTML을 해석하지 않고 그대로 출력되도록 해준..

    (스프링)pageContext.request.contextPath의 사용

    pageContext.request.contextPath는 웹에서 상대적인 경로를 나타낸다. pageContext 객체는 javax.servlet.jsp.PageContext 클래스를 상속해 웹 컨테이너가 JSP 실행시 자동으로 생성해서 제공하는 내장 객체이다. http를 이용한 url요청 방법은 1. 컨텍스트의 이름을 직접입력하는 방법이다. 2.