dukDukz

21.05.26 카카오 주소 API 의 기본 본문

웹 개발/Node JS

21.05.26 카카오 주소 API 의 기본

헤일리_HJ 2021. 5. 26. 14:27

카카오 개발자 페이지에서 지도/로컬 API를 가져와서 활용해보자

더보기

카카오 개발자 페이지에서

도구 - REST API 테스트

 

query에 값을 넣어서 검색해보자

 

 

이러한 결과 값이 나온다.

 

요청 코드를 참고하여 직접 요청해보기로 하자

 

 

 

+ 내 API key 값이 필요하다.

 

이 부분을 활용하면 된다.

 

 


 

 

요청해보자!

 

중요한 부분!

이 문서를 보고 API 요청을 할 줄 알아야 한다.

 

server.js

/*
express nunjucks
url : /
index.html 로 render
*/
const express = require('express')
const app = express();
const nunjucks = require('nunjucks')

app.set('view engine','html')
nunjucks.configure('views',{
    express:app,
})

app.get('/',(req,res)=>{
    res.render('index')
})

app.listen(3000,()=>{
    console.log('server 3000');
})

 

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>api</title>
    <script>
        // https://dapi.kakao.com/v2/local/search/address.json?analyze_type=similar&page=1&size=10&query=
        // headers -> Authorization: KakaoAK {REST_API_KEY}
        // api key -> 50bbb5205dc8fcc9c2611542015a54d5

        document.addEventListener('DOMContentLoaded',init);
        async function init(){
            let options ={
                method: 'GET',
                headers:{
                    "Authorization": "KakaoAK 50bbb5205dc8fcc9c2611542015a54d5"
                }
            }
            let result = await fetch('https://dapi.kakao.com/v2/local/search/address.json?analyze_type=similar&page=1&size=10&query=둔촌2동',options)
            let json = await result.json();     // 알아서 json 형태로 해줌

            console.log(json);
        }
    </script>
</head>
<body>
    hello api
</body>
</html>

이게 API 요청의 기본이라고 보면 된다.

이렇게 json 형태로 원하는 값이 온 걸 확인 할 수 있다.

 

 


 

 

* headers 부분을 넣지 않으면 이런 오류가 생긴다.

더보기
document.addEventListener('DOMContentLoaded',init);
        async function init(){
            let options ={
                method: 'GET',
            }
            let result = await fetch('https://dapi.kakao.com/v2/local/search/address.json?analyze_type=similar&page=1&size=10&query=둔촌2동',options)
            let json = await result.json();     // 알아서 json 형태로 해줌

            console.log(json);
        }

headers:{
                    "Authorization": "KakaoAK 50bbb5205dc8fcc9c2611542015a54d5"
                }

이 부분이 없어서 

이러한 오류가 나게 되었다.

꼭 내 key 값을 넣어서 API를 요청해야 한다.