[JavaScript] Ajax 비동기 통신에 대해서

 

Ajax란?

• Ajax는 Asynchronous JavaScript and XML의 약자로, 비동기적으로 데이터를 서버로부터 가져옴
• 즉, 페이지를 새로고침없이 동적으로 업데이트할 수 있는 웹개발 기술
• 웹 페이지에서 사용자의 입력이나 클릭 등의 이벤트가 발생하면, 페이지를 새로 고치지 않고 서버로부터 필요한 데이터를 비동기적으로 가져와서 페이지의 일부분만 업데이트 할 수 있음

비동기 통신

• 데이터를 서버로부터 가져오거나 전송할 때, 페이지를 새로고침하지 않고 백그라운드에서 데이터를 주고받을 수 있는 방식
• 응답이 병렬로 처리되기 때문에 응답이 올때까지 기다리지 않고 다른 작업을 할 수 있음
• 일반적으로 Ajax 요청이나 WebSocket과 같은 실시간 통신에 사용

Ajax의 기본 문법 (jQuery)

$.ajax({
  url: "요청을 보낼 URL",
  type: "HTTP 요청 방식",
  data: "서버로 보낼 데이터",
  dataType: "서버에서 받을 데이터의 형식",
  success: function(response) {
    // 성공적으로 요청을 처리했을 때 실행할 함수
  },
  error: function(jqXHR, textStatus, errorThrown) {
    // 요청 처리 중 오류가 발생했을 때 실행할 함수
  }
});