1 / 8

Ajax( A synchronous J avaScript A nd X ML)

Ajax( A synchronous J avaScript A nd X ML). ㅇ 일반적인 서버와의 데이터 통신은 submit 버튼을 누르거나 브라우저 주소창에 URL 을 입력해서 페이지가 리로딩 된 후 완료. ㅇ AJAX 를 사용한 방법은 필요한 데이터만을 웹서버에 요청해서 받음. ㅇ AJAX 장점 - 페이지 이동없이 화면 전환 가능 - 비동기식 작업이므로 서버의 응답을 기다리지 않아도 다른 작업이 가능 - 수신하는 데이터 양을 줄일 수있음

nuwa
Download Presentation

Ajax( A synchronous J avaScript A nd X ML)

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Ajax(Asynchronous JavaScript And XML) ㅇ 일반적인 서버와의 데이터 통신은 submit 버튼을 누르거나 브라우저 주소창에URL을 입력해서 페이지가 리로딩 된 후 완료 ㅇAJAX를 사용한 방법은 필요한 데이터만을 웹서버에 요청해서 받음 ㅇAJAX 장점 - 페이지 이동없이 화면 전환 가능 - 비동기식 작업이므로 서버의 응답을 기다리지 않아도 다른 작업이 가능 - 수신하는 데이터 양을 줄일 수있음 - 클라이언트에게 처리를 위임 가능 ㅇAJAX 단점 - 요청을 남발하면 오히려 역으로 서버의 부하가 늘수 있음 - 스크립트로 작성되므로 오류 수정이 어려움

  2. Ajax(Asynchronous JavaScript And XML) ㅇAJAX는 이미 존재하던 기술이었지만, 2005년 구글에서AJAX를 이용한 대화형 애플리케이션을 만들어 보이면서 빠르게 대중화 ㅇAJAX 구현방법 - JavaScript XMLHttpRequest 객체 생성 - jQuery $.ajax() 함수 이용

  3. JavaScript AJAX 구현 ㅇ XMLHttpRequest 객체 생성 ㅇ XMLHttpRequest 데이터 통신 설정

  4. JavaScript AJAX 구현 ㅇ CallBack 함수 정의

  5. JavaScript AJAX 구현 ㅇ서버 ajaxData.jsp

  6. JavaScript AJAX 구현 ㅇ 브라우저에서 데이터 입력 후 전송 ㅇ 서버에서 보낸 데이터 전송 결과 출력

  7. jQuery AJAX 구현 ㅇ AJAX 통신용 함수 정의

  8. jQuery AJAX 구현 ㅇ 브라우저에서 데이터 입력 후 전송 ㅇ 서버에서 보낸 데이터 전송 결과 출력

More Related