지난 번에도 정리를 한번 했지만, ajax라는 함수를 자주 쓴다.
어떤 파라미터가 어떤 형식으로 들어가는지, 어떤 기능을 제공하는지 더 구체적으로 정리해놓으면 좋을 거 같아서 쓰게 되었다.
Ajax(Asynchronous JavaScript and XML)는 비동기적으로 서버와 웹 브라우저 간에 데이터를 교환하는 기술이며, 웹 페이지를 새로 고치지 않고도 동적으로 데이터를 업데이트할 수 있게 해준다. 이를 가능하게 하는 핵심적인 요소 중 하나가 ajax() 메서드입니다.
- 비 동기적이란 어떤 작업이 순차적으로 진행되지 않고 병렬적으로 진행 되는 것을 말한다.
ajax() 메서드는 jQuery에서 제공하는 함수로, 서버로 HTTP 요청을 보내고 서버에서 데이터를 가져오는 역할을 합니다. 주로 다음과 같은 방식으로 사용됩니다:
HTTP 요청 보내기:
ajax() 메서드를 사용하여 서버에 HTTP 요청(GET, POST, PUT, DELETE 등)을 보낸다. 이때 요청에는 URL, 요청 형식, 데이터, 성공 및 실패시 실행할 콜백 함수 등이 포함될 수 있음
데이터 가져오기:
서버에서 데이터를 가져오기 위해 ajax() 메서드를 사용합니다. 서버의 응답으로 받은 데이터는 콜백 함수를 사용하여 처리할 수 있습니다.
비동기 통신:
ajax() 메서드를 사용하면 웹 페이지의 다른 부분을 새로 고치지 않고도 데이터를 동적으로 업데이트할 수 있습니다. 이는 비동기적으로 서버와 통신하기 때문에 가능합니다.
ajax() 메서드의 구문:
$.ajax({
url: "URL",
method: "GET", // HTTP 요청 방식(GET, POST, PUT, DELETE 등)
data: {key1: value1, key2: value2}, // 요청 데이터
dataType: "json", // 서버에서 반환되는 데이터 타입(json, xml, html 등)
success: function(response) {
// 성공 시 실행할 콜백 함수
console.log("Success:", response);
},
error: function(xhr, status, error) {
// 실패 시 실행할 콜백 함수
console.error("Error:", error);
}
});- 콜백 함수란
다른 함수의 인수로 전달되어 나중에 호출되는 함수를 말한다.
위 코드에서 url은 요청을 보낼 서버의 URL을 지정하고, method는 HTTP 요청 방식을 지정(GET, POST, PUT, DELETE 등), data는 요청에 포함할 데이터를 지정함. dataType은 서버에서 반환되는 데이터 타입을 지정하며, success 콜백 함수는 요청이 성공했을 때 실행되고, error 콜백 함수는 요청이 실패했을 때 실행된다.
