자바스크립트로 공공 API활용하여 XML 일출시간 일몰시간 가져오기
일단 소스는 이렇다.
<script>
var getLCRiseSetInfocnt=0;
function getLCRiseSetInfo()
{
getLCRiseSetInfocnt++;
var today = new Date();
var year = today.getFullYear();
var month = today.getMonth() + 1; // 월은 0부터 시작하므로 1을 더해줍니다.
var day = today.getDate();
// 월과 일이 한 자리 숫자인 경우 앞에 0을 추가합니다.
month = month < 10 ? '0' + month : month;
day = day < 10 ? '0' + day : day;
var formattedDate = year + '' + month + '' + day;
console.log('오늘의 날짜: ' + formattedDate);
var encodedServiceKey = encodeURIComponent('서비스키값');
$.ajax({
url: 'http://apis.data.go.kr/B090041/openapi/service/RiseSetInfoService/getLCRiseSetInfo',
type: 'GET',
data: {
serviceKey: encodedServiceKey,
locdate: formattedDate,
longitude: '위도',
latitude: '경도',
dnYn: 'Y'
},
dataType: 'xml',
success: function(responseXml) {
console.log('Success:', responseXml);
// 서버 응답 성공 시 처리
var $xml = $(responseXml);
// 필요한 정보 추출
var sunrise = $xml.find('sunrise').text();
var sunset = $xml.find('sunset').text();
//var moonrise = $xml.find('moonrise').text();
//var moonset = $xml.find('moonset').text();
//실행n번째 결과
console.log('n번째 결과 :', getLCRiseSetInfocnt);
// 추출한 정보 출력 또는 다른 작업 수행
console.log('일출 : Sunrise:', sunrise);
console.log('일몰 : Sunset:', sunset);
//console.log('Moonrise:', moonrise);
//console.log('Moonset:', moonset);
//결과값을 받아왔으면 멈춘다.
if(sunrise!='')
{
checkAndStopInterval();
var Sunrise = formatTime(sunrise);
var Sunset = formatTime(sunset);
document.getElementById('Sunrise').innerText = Sunrise;
document.getElementById('Sunset').innerText = Sunset;
document.getElementById('mSunrise').innerText = Sunrise;
document.getElementById('mSunset').innerText = Sunset;
//ID값을 찾아 innerText로 값을 변경해준다.
}
},
error: function(error) {
console.log('Error:', error);
getLCRiseSetInfo();
// 서버 응답 에러 시 처리
}
});
}
//최초실행
getLCRiseSetInfo();
//3초마다 실행되게 한다.
var intervalId = setInterval(getLCRiseSetInfo, 3000);
//루프를 멈추게 한다.
function checkAndStopInterval() {
console.log('값을 받음');
clearInterval(intervalId);
}
function formatTime(timeString) {
// 앞에 0을 추가하여 4자리로 만들기
timeString = timeString.padStart(4, '0');
// 시간과 분으로 분리
var hours = timeString.slice(0, 2);
var minutes = timeString.slice(2);
// 포맷팅된 문자열 반환
return hours + ':' + minutes;
}
</script>주석을 충분히 달아 놓아 활용하는데 무리는 없을 것이라 봅니다.
수고하세요.
참고사이트 : https://www.data.go.kr/data/15012688/openapi.do
한국천문연구원_출몰시각 정보
(천문우주정보)지역별 해달 출몰시각정보, 위치별 해달 출몰시각정보를 조회하는 서비스 입니다. 활용 시 날짜, 지역, 경도, 위도, 일출시각, 일몰시각, 일중시각, 월출시각, 월중시각, 월몰시각,
www.data.go.kr
이렇게 구축하니 로컬에서는 문제가 안보였는데 (왜인지 모름)
서버에 올리니 문제가 발생했네요.
CORS (Cross-Origin Resource Sharing) 문제로 인한 오류로 브라우저에서 동일 출처 정책(Same-Origin Policy)에 위배되는 경우, 브라우저는 보안상의 이유로 외부 도메인으로의 AJAX 요청을 차단된다고 합니다.
그래서 급히 수정해봅니다.
function getLCRiseSetInfo()
{
getLCRiseSetInfocnt++;
var today = new Date();
var year = today.getFullYear();
var month = today.getMonth() + 1; // 월은 0부터 시작하므로 1을 더해줍니다.
var day = today.getDate();
// 월과 일이 한 자리 숫자인 경우 앞에 0을 추가합니다.
month = month < 10 ? '0' + month : month;
day = day < 10 ? '0' + day : day;
var formattedDate = year + '' + month + '' + day;
var url = '/ajx/getLCRiseSetInfo';
var sql_state_value = "GetData";
var data = JSON.stringify({
sql_state : sql_state_value
, locdate : formattedDate
});
getPostData(url,data,callback_getLCRiseSetInfo);
}
function callback_getLCRiseSetInfo(result)
{
console.log('n번째 결과 :', getLCRiseSetInfocnt);
console.log(result.result);
if(result.result=='ok')
{
var responseXml = result.xml;
var $xml = $(responseXml);
// 필요한 정보 추출
var sunrise = $xml.find('sunrise').text();
var sunset = $xml.find('sunset').text();
//var moonrise = $xml.find('moonrise').text();
//var moonset = $xml.find('moonset').text();
//실행n번째 결과
console.log('n번째 결과 :', getLCRiseSetInfocnt);
// 추출한 정보 출력 또는 다른 작업 수행
console.log('일출 : Sunrise:', sunrise);
console.log('일몰 : Sunset:', sunset);
//console.log('Moonrise:', moonrise);
//console.log('Moonset:', moonset);
if(sunrise!='')
{
checkAndStopInterval();
var Sunrise = formatTime(sunrise);
var Sunset = formatTime(sunset);
document.getElementById('Sunrise').innerText = Sunrise;
document.getElementById('Sunset').innerText = Sunset;
document.getElementById('mSunrise').innerText = Sunrise;
document.getElementById('mSunset').innerText = Sunset;
}
if(getLCRiseSetInfocnt>7)
{
checkAndStopInterval();
}
}
}
getLCRiseSetInfo();
var intervalId = setInterval(getLCRiseSetInfo, 5000);
function checkAndStopInterval() {
console.log('값을 받음');
clearInterval(intervalId);
}
function formatTime(timeString) {
// 앞에 0을 추가하여 4자리로 만들기
timeString = timeString.padStart(4, '0');
// 시간과 분으로 분리
var hours = timeString.slice(0, 2);
var minutes = timeString.slice(2);
// 포맷팅된 문자열 반환
return hours + ':' + minutes;
}
//추가로 컨트롤러에 XML데이터를 요청하는 코드를 작성하여 XML을 받아오게 하였습니다.
function getContextPath(){
var ctxPath=$("#web_contextPath").val();
return ctxPath;
}
function getPostData(inurl,indata,myfunction,in_async)
{
var async_value=true;
if(in_async==false)
{
async_value=false;
}
$.ajax({
type : 'post',
url : getContextPath()+inurl,
headers : {
"Content-Type" : "application/json",
"X-HTTP-Method-Override" : "POST",
'X-CSRF-TOKEN': $("#csrf_token").val()
},
dataType : 'text',
data : indata,
async: async_value,
error:function(request,status,error)
{
//alert("알림",status+error);
console.log("ajax error : " + status+","+error);
},
success : function(result) {
//console.log("result: " + result);
var obj = jQuery.parseJSON( result );
if(myfunction!=null)
{
myfunction(obj);
}
}
});
}
</script>자바 소스단은 https://www.data.go.kr/data/15012688/openapi.do 제공소스 자바부분을 참고하여 만들었습니다.
//일출일몰 API사용하기
@ResponseBody
@RequestMapping(value = "/getLCRiseSetInfo", method = RequestMethod.POST, produces = "application/json;charset=UTF-8")
public CommonData getLCRiseSetInfo(@RequestBody CommonData dto) throws Exception {
smsp.print_String("/ajxAgent/get_cal_month_data");
CommonData result_map = new CommonData();
smsp.print_CommonData(dto);
Calendar cal = Calendar.getInstance();
String locdate = dto.get("locdate", "20240311");
StringBuilder sb = new StringBuilder();
try {
StringBuilder urlBuilder = new StringBuilder("http://apis.data.go.kr/B090041/openapi/service/RiseSetInfoService/getLCRiseSetInfo"); /*URL*/
urlBuilder.append("?" + URLEncoder.encode("serviceKey","UTF-8") + "서비스 키"); /*Service Key*/
urlBuilder.append("&" + URLEncoder.encode("locdate","UTF-8") + "=" + URLEncoder.encode(locdate, "UTF-8")); /*날짜*/
urlBuilder.append("&" + URLEncoder.encode("longitude","UTF-8") + "=" + URLEncoder.encode("XXX.3673", "UTF-8")); /*위도*/
urlBuilder.append("&" + URLEncoder.encode("latitude","UTF-8") + "=" + URLEncoder.encode("XXX.50363", "UTF-8")); /*경도*/
urlBuilder.append("&" + URLEncoder.encode("dnYn","UTF-8") + "=" + URLEncoder.encode("Y", "UTF-8")); /**/
URL url = new URL(urlBuilder.toString());
HttpURLConnection conn = (HttpURLConnection) url.openConnection();
conn.setRequestMethod("GET");
conn.setRequestProperty("Content-type", "application/json");
//System.out.println("Response code: " + conn.getResponseCode());
BufferedReader rd;
if(conn.getResponseCode() >= 200 && conn.getResponseCode() <= 300) {
rd = new BufferedReader(new InputStreamReader(conn.getInputStream()));
} else {
rd = new BufferedReader(new InputStreamReader(conn.getErrorStream()));
}
String line;
while ((line = rd.readLine()) != null) {
sb.append(line);
}
rd.close();
conn.disconnect();
result_map.put("result", "ok");
result_map.put("xml", sb.toString());
} catch (Exception e) {
// TODO: handle exception
result_map.put("result", "fail");
}
return result_map;
}이상입니다. 수고하세요.
'JAVASCRIPT 자바스크립트' 카테고리의 다른 글
| 특정일 기준으로 작동하기 (0) | 2023.10.30 |
|---|---|
| CHART.JS 사용법 정리 (0) | 2022.03.21 |
| 자바스크립트 아코디언 accordion javascript (0) | 2020.05.12 |
| javascript scroll to top of page 자바스크립트 페이지 탑이동 (0) | 2020.05.12 |
| 자바스크립트 이벤트 사용 (0) | 2020.05.11 |
은호아빠
여행, 맛집, 일상, 프로그래밍, 개발자, 윈도우, 웹, jsp, spring, db, mysql, oracle, c#