웹 개발 지식 블로그

Ajax란? Ajax란 Asynchronous JavaScript and XML (비동기식 자바스크립트와 xml)의 약자이다. 브라우저가 가지고 있는 XMLHttpRequest 객체를 이용해 비동기식으로 서버와 통신하는 기술이다. 즉, JavaScript를 사용한 비동기 통신이며 클라이언트와 서버간에 JSON, XML 등의 데이터를 주고받을 수 있는 기술이다. Q) 비동기식 (Asynchronous)? 비동기식이란 여러가지 일이 동시적으로 발생한다는 뜻으로, 서버와 통신하는 동안 다른 작업을 할 수 있다는 의미를 지닌다. Ajax의 장점? 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신할 수 있다. (기본적으로 HTTP는 Connectionless 한 성질을 갖는다. 즉, 일반적으로..

이전 글에서 클라이언트 부분에서의 아이디 유효성 검사를 진행하였다. (2019/04/29 - [웹 개발/EgovFramwork] - 전자정부 프레임워크로 회원가입 기능 구현하기 - 아이디 유효성 검사-1) 이번에는 클라이언트 쪽에서 보낸 Ajax 요청을 서버쪽에서 컨트롤러로 받아 Ajax로 받아온 데이터를 서비스, 맵퍼로 전달하고 DB에서 쿼리를 수행하여 중복된 아이디가 있는지 검사할 것이다. URL 요청과정 위와 같이 화면에서 아이디를 입력하고 아이디 중복 확인 버튼을 누를 시 쿼리 스트링으로 loginId 데이터를 가지고 get 요청을 하게 된다. (http://localhost:8080/registerExample/selectDupIdChk.do?loginId=spring123 -> 요청 URL은 ..

이전 글에서 회원가입 화면을 띄워 보았다. (2019/04/18 - [웹 개발/EgovFramwork] - 전자정부 프레임워크로 회원가입 기능 구현하기 - 회원가입 폼 고르고 첫화면 띄우기) 회원가입을 구현할 때 필수적으로 해야되는 작업이 유효성 검사이다. 유효성 검사는 클라이언트, 서버 쪽 두 군데에서 모두 해주어야 한다. 이번에는 먼저 클라이언트 부분의 아이디 유효성 검사를 구현해 보려고 한다. 아이디 유효성 검사 먼저 아이디는 중복될 수 없으므로 아이디 중복 검사를 실시할 것이다. 아이디는 DB에 저장되기 때문에 서버를 거쳐야 한다. 서버와 통신하기 위해 AJAX 방식으로 입력한 ID 데이터만을 서버로 전달하고 아이디 존재여부 결과를 JSON 데이터로 서버를 통해 반환받을 것이다. 아이디 중복체크 ..