2023-01-16 JSON, AJAX 랭킹정보

JSON(JavaScript Object Notation)

Javascript 객체 문법이며 구조화된 데이터를 표현하기 위한 문자 기반의 표준 포맷으로, 다른 언어와 플랫폼에서 해석가능한 형식으로 전송할 수 있게 해주는 데이터 교환 포맷이다.

AJAX(Asynchronous JavaScript And XML)

비동기 자바스크립트와 XML을 뜻한다. 간단히 말하면, 서버와 통신하기 위해 XMLHttpRequest(XHR)객체를 사용하는 것을 말한다. 비동기성이기 때문에 새로고침없이도 일부 서비스를 업데이트할 수 있다.

XMLHttpRequest
(XHR) 객체는 서버와 상호작용할 때 사용한다. XHR을 사용하면 페이지의 새로고침 없이도 URL에서 데이터를 가져올 수 있다. 이를 활용하면 사용자의 작업을 방해하지 않고 페이지의 일부를 업데이트할 수 있다.

충전량을 총 합산하여 상위 3개의 충전소 정보를 가져오는 쿼리만들기 => 메소드 실행 후 비동기성 통신을 위해 @ResponseBody 어노테이션 사용하여 데이터 넘겨주기

JSON객체로 받아와 적절한 위치에 데이터 부여하기

$.ajax({
    url : "/evweb/chargingAmountRank",
    type : "POST",
    data : querydata,
    dataType : "json",
    success : function(data)

새로고침없이도 랭킹 데이터만 업데이트 가능

HT Prog