Ajax란?
비동기 자바스크립트와 XML (Asynchronous JavaScript And XML)을 말하며, 새로고침 없이 데이터를 주고 받으며 전체 페이지가 아닌 일부분만을 업데이트 할 수 있다
jQuery로 ajax 요청
get
$.get('url');
$.get('https://codingapple1.github.io/hello.txt')
.done(function (data) { //연결 성공시
console.log(data);
})
.fail(function () { //연결 실패시
console.log('실패');
})- 데이터는
.done(function (data){})콜백함수 파라미터 속에 존재
post
$.post('url', {key : value})
$.post('url', { name: 'kim' })
.done(function (data) {
console.log(data);
})- don => then
fail => catch 로 사용 가능
자바스크립트로 ajax 요청
fetch('url')
.then(res => res.json()) // JSON으로 변경
.then(function(data){
console.log(data)
})
.catch(function(error){
console.log('실패함')
});-
fetch 함수 사용
-
서버와 데이터를 주고 받을 때는 문자만 사용 가능 (array, object X)
-
제이쿼리는 자동으로 JSON으로 변경해 전송하고, 도착하면 다시 array/object 타입으로 변경해줌
-
fetch()는 res.json() 코드를 추가하여 직접 변경
JSON 형태
"{ "데이터 이름" : "값" }"
