AJAX   Asynchronous Java Script and XML  

(2022-08-06)

Ajax, fetch


1. AJAX

  ㅇ 기존의 HTML 관련 기술과는 달리, 
     - 사용자 클릭 후 페이지 전체를 새로 고치지 않고,  
     - 필요한 부분만 바로 고치는 형태로,  (동적으로 부분 갱신하는 형태)
     - 빠른 응답을 제공하는 기술을 지칭하는 용어

  ㅇ 용어 출현
     - Adaptive Path의 제시 제임스 가렛(Jesse James Garrett)이 2005년2월 이 명칭을
       언급하게 되면서 널리 퍼진 용어


2. 특징

  ㅇ AJAX는 한 가지 기술을 의미하는 것은 아님
     - 자바 스크립트, XML, DOM, CSS 등 다양한 기술이 결합되어 있는 기술
        . AJAX의 대표적인 예로는 2005년도에 나타난 구글 맵(Google Map)이 있음

  ㅇ 서버 측과 웹브라우저 간의 데이터 교환/처리가 비동기적임
     - 사용자 이벤트 요청에 따라,
        . 전체 웹 페이지를 다운로드하지 않고,
        . 필요한 부분 만 백그라운드 상태에서 처리됨
        . 즉, 비동기적으로 통신함으로써, 클라이언트측은 다른 작업을 계속 할 수 있게 됨

  ㅇ 서버데이터 제공
     - XML, HTML, JSON텍스트 파일 포멧으로 제공됨 (현재 XML은 잘 사용 안함)

  ㅇ HTTP 전송을 기본으로 함


3. HTTP 전송을 기반으로 하는 요청 응답XHR(XMLHttpRequest) 객체를 기반으로 호출 및 응답 처리를 함
     - XHR 객체
        . 데이터를 원격에서 받아오며, DOM을 조작하며, 그 데이터웹페이지 내에 삽입하는 등
        . 웹서버와의 비동기 통신을 지원하는, 각종 메소드,프로퍼티들을 제공
     - XHR 객체의 생성 방법
        . XMLHttpRequest 생성자를 통한 native XHR 객체를 생성하면 됨
           .. var xhr = new XMLHttpRequest(); 

     * [참고] ☞ XMLHttpRequest 객체, jQuery Ajax 참조

  ㅇ fetch 함수
    - [문법]  const promise = fetch (url [, options]);

Ajax
   1. Ajax   2. XMLHttpRequest 객체   3. XHR 프로퍼티,메소드,이벤트   4. JSON  
차세대 웹
   1. 웹 2.0   2. AJAX   3. Open API   4. RIA  


Copyrightⓒ written by 차재복 (Cha Jae Bok)
"본 웹사이트 내 모든 저작물은 원출처를 밝히는 한 자유롭게 사용(상업화포함) 가능합니다"