Ajax통신의 이해

Ajax

Ajax는 JavaScript의 라이브러리중 하나이며 Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자입니다. Ajax를 한마디로 정의하자면 JavaScript를 사용한 비동기 통신, 클라이언트와 서버간에 XML 데이터를 주고받는 기술이라고 할 수 있겠습니다.

*비동기(async) 방식

비동기 방식은 웹페이지를 리로드하지 않고, 즉 새로고침없이 데이터를 불러오는 방식입니다. 이 방식의 장점은 페이지 리로드의 경우처럼 전체 리소스를 불러오지않고 필요한 부분만 불러와 사용할 수 있다는 장점이 있습니다.

사용하는 이유

기본적으로 http프로토콜은 클라이언트 쪽에 request를 보내고 Server에서 Response를 받으면 이어졌던 연결은 끊어지도록 되어있습니다. 그래서 화면의 내용을 수정하기 위해서는 다시 요청을하고 응답을 하며 전체 페이지를 갱신합니다. 이 경우 페이지의 일부분만 수정되더라도 전체부분을 다시 로드해야한다는 자원낭비문제가 발생합니다. 하지만 ajax를 이용하면 html 전체 페이지가 아닌 일부분만 갱신하도록 XML HttpRequest 객체를 통해 서버에 request를 합니다. 이러한 경우 JSON 또는 XML 형태로 필요한 데이터만 받아 갱신하기 때문에 그만큼 자원과 시간을 아끼는 것이 가능합니다.

장점

1. 웹페이지 속도향상
2. 서버의 처리완료까지 기다리지 않고 처리가능
3. 서버에 Data만 전송하면 되므로 코드의 양이 줄어든다.
4. 기존 웹에서 불가능했던 다양한 UI를 가능하게 한다.예를 들어 사진 공유 사이트 경우 제목이나 태그를 페이지 리로드 없이 수정가능

단점

1. 히스토리 관리가 힘들기 때문에 보안에 신경을 써야한다.
2. 연속적으로 데이터를 요청할 경우 서버 부하가 증가할 수 있다.
3. XMLHttpRequest를 통해 통신을하는 경우 사용자에게 아무런 진행 정보가 주어지지 않는다. 따라서 요청이 완료되지 않았는데 사용자가 페이지를 떠나거나 오작동할 우려가 있다.

 

참고 블로그

https://coding-factory.tistory.com/

코딩팩토리