[JavaScript]Ajax란?

AJAX = Asynchronous JavaScript And XML

 

비동기 JavaScript 및 XML

AJAX is not a programming language.

 

AJAX는 웹 서버와 데이터를 뒤에서 교환함으로써 웹 페이지를 비동기적으로 업데이트할 수 있도록 한다. 즉, 전체 페이지를 다시 로드하지 않고 웹 페이지의 일부를 업데이트할 수 있습니다.

 

Ajax는 서버와 데이터주고받는 법 중 하나인데 새로고침 없이 GET, POST를 요청하는 기능!!

 

서버와 유저는 문자자료만 주고 받을 수 있음.

 

따라서 Object, array를 보내고 싶으면 따옴표로 감싸서 문자처럼 JSON으로 변환하여 보내줌.

'{ "price" : 5000 }'  //JSON 예제

근데!! 이런건 JQuery로 요청하면 자동 변환이 되기때문에 따로 바꿔줄 필요가 없다.

기본함수(Javascript)로 요청하면 바꿔줘야 함.

받은 데이터가 JSON일때는 

res.json() //이거 추가하면 array/object자료형으로 바꿔줌

---

JQuery로 AJAX 요청한 예제

$.get('https://codingapple1.github.io/hello.txt')
  .done(function(data){
    console.log(data)
  })
  .fail(function(error){
    console.log('실패함')
  });

get으로 자료 받기.

fail은 자료 받는 것을 실패했을 때 출력 될 메세지.

---

Jquery를 사용하지 않은 Javascript만으로 구현한 Ajax 요청 예제

fetch('https://codingapple1.github.io/price.json')
  .then(res => res.json())
  .then(function(data){
    console.log(data)
  })
  .catch(function(error){
    console.log('실패함')
  });

---

코딩애플 강의를 듣고 작성하는 글입니다.