반응형
시작하기
1. 카카오 개발자 사이트 접속 후 로그인을 해줍니다.
2. 새 애플리케이션을 생성한 뒤 기본입력 사항인 애플리케이션 이름, 사업자 명, 카테고리를 입력해줍니다.
3. 대시보드에서 API키를 확인 후 상황에 맞춰 사용해주면 됩니다.
이번 내용에서 다룰 API는 REST API 키를 활용하여 진행됩니다.
해당 API 사용에 관련하여 다양한 방식으로 사용할 수 있으며, 해당 글에서 사용할 방식은 jQuery 방식으로 진행이 됩니다.
소스코드
<script>
$(document).ready(function() {
function getLatLng(address) {
var api_key = "REST_API_KEY"; // Replace with your actual API key
var url = "https://dapi.kakao.com/v2/local/search/address.json";
$.ajax({
url: url,
method: "GET",
headers: {
'Authorization': 'KakaoAK ' + api_key
},
data: {
query: address
},
success: function(data) {
if (data.documents && data.documents.length > 0) {
var lat = data.documents[0].y;
var lng = data.documents[0].x;
console.log("Latitude: " + lat + ", Longitude: " + lng);
// Utilize the latitude and longitude as needed
} else {
console.log("No results found.");
}
},
error: function(xhr, status, error) {
console.log("Error: " + error);
}
});
}
// Example usage
getLatLng('주소값을 넣어줍니다.');
});
</script>
코드 설명
- API KEY : REST_API_KEY 카카오 개발자에서 전달 받은 REST_API 키를 넣어주시면 됩니다.
- URL : 카카오 OpenAPI
- getLatLng : 해당 API를 사용을 편하게 하기 위해 함수화를 시켰으며, 해당 주소 값을 받아 실행시켜줍니다.
사용 예
getLatLng('위도, 경도값을 가져올 주소명');
반응형
'웹 공부' 카테고리의 다른 글
웹 페이지 접속 시 간혹 보이는 503 에러 (Service Unavailable)는 무엇인가? (0) | 2024.04.03 |
---|---|
[Js] JavaScript로 날짜 간 차이 계산하기 - 당일부터 X박 Y일까지 표시하기 (0) | 2024.03.22 |
[Js] JavaScript의 Split() 함수 및 jQuery를 사용하여 특정 문자 기준으로 나누기 (0) | 2024.03.20 |
jQuery와 JavaScript를 이용한 마우스 이벤트 처리 - 왼쪽 및 오른쪽 클릭 이벤트 (1) | 2024.01.14 |
JavaScript에서 현재 날짜를 'YYYY-MM-DD' 형식으로 얻는 방법 (0) | 2024.01.11 |