API????????

API란?

API : Application Programming Interface 의 약자로 응용 프로그램 사이의 인터페이스라고 해석하며 응용 프로그램 사이의 소통 방법을 의미한다.

사용 모듈

이전 까지 app.get(), app.post() 등의 express 메서드를 통해 내 서버의 get, post 요청을 구현해 봤는데 다른 서비스 API요청을 위해서는 request, axios등의 http 통신 라이브러리가 필요하다.

먼저 이 둘의 차이점을 알아보자

1. request npm 초창기부터 있던 모듈이며 현재는 유지보수가 중단된 상태이다. 큰 단점은 promise 기반이 아니다.
2. axios 대부분의 브라우저를 지원한다. (구형 브라우저 및 최신 브라우저까지) JSON 데이터를 자동으로 변환해준다. 다양한 기능들이 있다(요청을 중간에 취소한다거나, 응답시간 초과 시 어떤 동작을 하게 한다거나) 가독성이 좋게 구성되어 있다. Promise 기반이다.

여기서는 axios을 이용해 API를 활용한다.

먼저 npm install axios 명령어를 통해 설치를 진행하고 공공데이터를 이용하여 API를 사용해보자

공공데이터 API 신청하기

공공데이터 포털에 접속하여 대기오염정보 데이터를 활용신청을 하자

신청이 완료되면 계발 계정에서 신청한 데이터의 인증키를 확인이 가능하다.

요청을 보낼 주소와 파라미터 정보들은 모두 활용 가이드에 나와 있고 이를 참조하면 된다.

이제 요청을 보낼 url을 만들어주고 get()함수를 이용해 요청을 보내보자

const morgan = require('morgan');
const axios = require('axios');
const express = require('express');
const app = express();

/* 포트 설정 */
app.set('port', process.env.PORT || 8080);

/* 공통 미들웨어 */
app.use(morgan('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: true }));

/* 라우팅 설정 */
app.get('/airkorea', async (req, res) => {
    const serviceKey = "인증키";
    const airUrl = "<http://apis.data.go.kr/B552584/ArpltnInforInqireSvc/getMsrstnAcctoRltmMesureDnsty?">;

    let parmas = encodeURI('serviceKey') + '=' + serviceKey;
    parmas += '&' + encodeURI('numOfRows') + '=' + encodeURI('1');
    parmas += '&' + encodeURI('pageNo') + '=' + encodeURI('1');
    parmas += '&' + encodeURI('dataTerm') + '=' + encodeURI('DAILY');
    parmas += '&' + encodeURI('ver') + '=' + encodeURI('1.0');
    parmas += '&' + encodeURI('stationName') + '=' + encodeURI('마포구');
    parmas += '&' + encodeURI('returnType') + '=' + encodeURI('json')

    const url = airUrl + parmas;

    try {
        const result = await axios.get(url);
        res.json(result.data); // .data
    } catch (error) {
        console.log(error);
    }
});

/* 서버와 포트 연결.. */
app.listen(app.get('port'), () => {
    console.log(app.get('port'), '번 포트에서 서버 실행 중 ..')
});

url과 serviceKey, 지역, 페이지 수 등의 옵션을 지정한 prameters를 연결해 하나의 url로 만들어 axios.get() 메서드를 통해 요청을 보낸다.

이기서 중요한 점은 axios로 받은 결과는 뒤에 꼭 .data를 붙여주어야 한다.

이렇게 보낸 요청은 콜 스택으로 들어가서 실행되는 것이 아닌 작업큐에 들어가고 자바스크립트 내부에서 일어나는 작업이 모두 끝나고 실행된다.

async/await 처리를 해주지 않으면 axios로 보낸 요청에 대한 응답이 오기도 전에 res.json() 부분이 실행되어 빈 object가 뿌려지게 된다.

 

생성한 라우터 /airkorea에 접속해보면 대기 오염과 관련된 json 데이터가 표시된다. 이 json 데이터를 파악해서 우리가 원하는 정보를 뽑는 작업을 해야한다.

일단 결과를 보면 json/data/response/body/items 라는 키 안에 객체, 문자열의 값을 담고 있다. 여기서 관측시간, pm10, pm25 수치를 뽑아보자

 

const morgan = require('morgan');
const axios = require('axios');
const express = require('express');
const app = express();

/* 포트 설정 */
app.set('port', process.env.PORT || 8080);

/* 공통 미들웨어 */
app.use(morgan('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: true }));

/* 라우팅 설정 */
app.get('/airkorea/detail', async (req, res) => {
    const serviceKey = "인증키";
    const airUrl = "<http://apis.data.go.kr/B552584/ArpltnInforInqireSvc/getMsrstnAcctoRltmMesureDnsty?">;

    let parmas = encodeURI('serviceKey') + '=' + serviceKey;
    parmas += '&' + encodeURI('numOfRows') + '=' + encodeURI('4');
    parmas += '&' + encodeURI('pageNo') + '=' + encodeURI('2');
    parmas += '&' + encodeURI('dataTerm') + '=' + encodeURI('MONTH');
    parmas += '&' + encodeURI('ver') + '=' + encodeURI('1.3');
    parmas += '&' + encodeURI('stationName') + '=' + encodeURI('마포구');
    parmas += '&' + encodeURI('returnType') + '=' + encodeURI('json')
    const url = airUrl + parmas;

    try {
        const result = await axios.get(url);
        const airItem = {
            "time": result.data.response.body.items[0]['dataTime'], // 시간대
            "pm10": result.data.response.body.items[0]['pm10Value'], // pm10 수치
            "pm25": result.data.response.body.items[0]['pm25Value'] // pm25 수치
        }
        const badAir = [];
        // pm10은 미세먼지 수치
        if (airItem.pm10 <= 30) {
            badAir.push("좋음😀");
        } else if (airItem.pm10 > 30 && airItem.pm10 <= 80) {
            badAir.push("보통😐");
        } else {
            badAir.push("나쁨😡");
        }

        //pm25는 초미세먼지 수치
        if (airItem.pm25 <= 15) {
            badAir.push("좋음😀");
        } else if (airItem.pm25 > 15 && airItem.pm10 <= 35) {
            badAir.push("보통😐");
        } else {
            badAir.push("나쁨😡");
        }

        res.send(`관측 시간: ${airItem.time} 

        미세먼지 ${badAir[0]} 초미세먼지 ${badAir[1]} 입니다.`);
    } catch (error) {
        console.log(error);
    }
});

/* 서버와 포트 연결.. */
app.listen(app.get('port'), () => {
    console.log(app.get('port'), '번 포트에서 서버 실행 중 ..')
});

dataTime이라는 값을 추출하고 싶을 때 경로를 json 데이터를 표현하는 점/괄호법을 사용하면 result.data.response.body.items[’dataTime’] 처럼 표현할 수 있다. 이런 방식으로 값을 추출하여 airItem이라는 객체에 넣고 값에 따라 결과를 보여주는 로직을 통해 결과를 확인해 보자!