$.ajax({
type: "GET",
url: "여기에URL을입력",
data: {},
success: function(response){
console.log(response)
}
})
GET 요청은, url뒤에 아래와 같이 붙여서 데이터를 가져갑니다.
http://naver.com?param=value¶m2=value2
POST 요청은, data : {} 에 넣어서 데이터를 가져갑니다.
data: { param: 'value', param2: 'value2' },
위 주소 API 내용은 아래와 같다.
{"RealtimeCityAir":{"list_total_count":25,"RESULT":{"CODE":"INFO-000","MESSAGE":"정상 처리되었습니다"},"row":[{"MSRDT":"202108201600","MSRRGN_NM":"도심권","MSRSTE_NM":"중구","PM10":18.0,"PM25":14.0,"O3":0.058,"NO2":0.02,"CO":0.4,"SO2":0.003,"IDEX_NM":"보통","IDEX_MVL":74.0,"ARPLT_MAIN":"O3"},{"MSRDT":"202108201600","MSRRGN_NM":"도심권","MSRSTE_NM":"종로구","PM10":18.0,"PM25":14.0,"O3":0.069,"NO2":0.012,"CO":0.4,"SO2":0.003,"IDEX_NM":"보통","IDEX_MVL":83.0,"ARPLT_MAIN":"O3"},........이하 생략
뭔가 붸리 복잡쓰 해보이지만 차근히 보자면, 제일 처음 보이는 "RealtimeCityAir"와 뭔가 정상적으로 처리가 되었구나 하는 것을 알겠고 이후에 보이는 "row" 가 갖고있는 []!!! [리스트가 보일것이다~]
[리스트 안에 {중괄호로 이렇게 하나의 딕셔너리로 묶여있구나~ 하는 것을 알고 난 후에!}]
우리가 뽑아내고자 하는 데이터 코드만 갖고오면 된다.
((뭔가 이차 배열처럼 보이지 않는가?! 나는 이걸 이차배열 형식이라고 대강 넘겨짚고, 그렇기 때문에 response[][]이런 형식으로 갖고오게끔 코드가 정해진게 아닌가~ 하고 생각하고 넘어감 ))
$.ajax({ type: "GET", url: "http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99", data: {}, success: function (response) { let rows = response["RealtimeCityAir"]["row"]; for (let i = 0; i < rows.length; i++) { let gu_name = rows[i]['MSRSTE_NM']; let gu_mise = rows[i]['IDEX_MVL']; console.log(gu_name,gu_mise); } } })
API 주소: https://api.thecatapi.com/v1/images/search
위 주소 API 내용은 아래와 같다.
[{"breeds":[],"id":"-n_U0851p","url":"https://cdn2.thecatapi.com/images/-n_U0851p.jpg","width":500,"height":331}]
Example01과 다르게 이번 데이터는 리스트와 딕셔너리 1개로 이루어진것을 확인 할 수 있다.
딕셔너리가 1개니까 for문 돌릴 필요 없이 response[0]으로 해당 데이터를 확인 해 볼 수 있다. 딕셔너리는 1개지만 그래도 리스트로 묶여있기 때문에 respons[0]['url'] []2개를 붙여서 첫번째 딕셔너리에있는 url 데이터를 불러온다.
$.ajax({ type: "GET", url: "https://api.thecatapi.com/v1/images/search", data: {}, success: function(response){ console.log(response[0]['url']); } })
위 주소 API 내용은 아래와 같다.
{"date":"2021\ub144 08\uc6d4 20\uc77c","rate":1182.13}
Example01, Example02 와 다르게 이번 데이터는 리스트[]가 아닌 딕셔너리{} 1개로 이루어진것을 확인 할 수 있다.
((이번에는 그냥 일차배열같은 느낌이지 않는가!! 그러니까 그냥 response[ ] 이렇ㄱ0ㅔ..ㅎㅎ라고 이해하고 넘어감))
$.ajax({ type: "GET", url: "http://spartacodingclub.shop/sparta_api/rate", data: {}, success: function(response){ let rate=response['rate']; console.log(response['rate']); } })