implement get currnet weather infromation api
- implement get currnet weather infromation api - connect the api with frontend
Showing
2 changed files
with
98 additions
and
1 deletions
| ... | @@ -4,6 +4,7 @@ var axios = require("axios"); | ... | @@ -4,6 +4,7 @@ var axios = require("axios"); |
| 4 | 4 | ||
| 5 | const openAPIKey = require("./secrets.json").openAPIKey; | 5 | const openAPIKey = require("./secrets.json").openAPIKey; |
| 6 | const googleMapKey = require("./secrets.json").googleAPIKey; | 6 | const googleMapKey = require("./secrets.json").googleAPIKey; |
| 7 | +const weatherAPIKey = require("./secrets.json").weatherAPIKey; | ||
| 7 | 8 | ||
| 8 | axios.create({ | 9 | axios.create({ |
| 9 | // TODO : 웹을 AWS에 올릴때, 해당 baseURL이 달라져야할 수 있음 | 10 | // TODO : 웹을 AWS에 올릴때, 해당 baseURL이 달라져야할 수 있음 |
| ... | @@ -25,6 +26,39 @@ router.get("/", async function (req, res, next) { | ... | @@ -25,6 +26,39 @@ router.get("/", async function (req, res, next) { |
| 25 | res.send(airCondition); | 26 | res.send(airCondition); |
| 26 | }); | 27 | }); |
| 27 | 28 | ||
| 29 | +router.get("/weather", async function (req, res, next) { | ||
| 30 | + console.log("경도:", req.query.latitude); | ||
| 31 | + console.log("경도:", req.query.longitude); | ||
| 32 | + | ||
| 33 | + let airCondition = ""; | ||
| 34 | + let response = await getEnglishPosition( | ||
| 35 | + req.query.latitude, | ||
| 36 | + req.query.longitude | ||
| 37 | + ) | ||
| 38 | + .then((encodedStation) => getWeather(encodedStation)) | ||
| 39 | + .then((result) => { | ||
| 40 | + airCondition = result; | ||
| 41 | + }); | ||
| 42 | + | ||
| 43 | + res.send(airCondition); | ||
| 44 | +}); | ||
| 45 | + | ||
| 46 | +const getWeather = (encodedStation) => { | ||
| 47 | + return axios | ||
| 48 | + .get( | ||
| 49 | + "https://api.openweathermap.org/data/2.5/weather?q=" + | ||
| 50 | + encodedStation + | ||
| 51 | + "&appid=" + | ||
| 52 | + weatherAPIKey | ||
| 53 | + ) | ||
| 54 | + .then(function (response) { | ||
| 55 | + return response["data"]; | ||
| 56 | + }) | ||
| 57 | + .catch(function (error) { | ||
| 58 | + console.log(error.response); | ||
| 59 | + }); | ||
| 60 | +}; | ||
| 61 | + | ||
| 28 | const getPosition = (lat, lon) => { | 62 | const getPosition = (lat, lon) => { |
| 29 | return axios | 63 | return axios |
| 30 | .get( | 64 | .get( |
| ... | @@ -58,6 +92,29 @@ const getPosition = (lat, lon) => { | ... | @@ -58,6 +92,29 @@ const getPosition = (lat, lon) => { |
| 58 | console.log(error.response); | 92 | console.log(error.response); |
| 59 | }); | 93 | }); |
| 60 | }; | 94 | }; |
| 95 | + | ||
| 96 | +const getEnglishPosition = (lat, lon) => { | ||
| 97 | + return axios | ||
| 98 | + .get( | ||
| 99 | + "https://maps.googleapis.com/maps/api/geocode/json?latlng=" + | ||
| 100 | + lat + | ||
| 101 | + "," + | ||
| 102 | + lon + | ||
| 103 | + "&location_type=ROOFTOP&result_type=street_address&key=" + | ||
| 104 | + googleMapKey + | ||
| 105 | + "&language=en" | ||
| 106 | + ) | ||
| 107 | + .then(function (response) { | ||
| 108 | + let stationName = | ||
| 109 | + response["data"].results[0]["address_components"][3]["long_name"]; | ||
| 110 | + console.log("STATION : ", stationName); | ||
| 111 | + return (encodedStation = encodeURI(stationName)); | ||
| 112 | + }) | ||
| 113 | + .catch(function (error) { | ||
| 114 | + console.log(error.response); | ||
| 115 | + }); | ||
| 116 | +}; | ||
| 117 | + | ||
| 61 | /* GET route airCondition listing. */ | 118 | /* GET route airCondition listing. */ |
| 62 | router.get("/route", async function (req, res, next) { | 119 | router.get("/route", async function (req, res, next) { |
| 63 | console.log("출발지:", req.query.departure); | 120 | console.log("출발지:", req.query.departure); | ... | ... |
| ... | @@ -31,6 +31,12 @@ export default class Home extends Component { | ... | @@ -31,6 +31,12 @@ export default class Home extends Component { |
| 31 | region: "은평구청", | 31 | region: "은평구청", |
| 32 | curAirCondition: null, | 32 | curAirCondition: null, |
| 33 | routeInformation: null, | 33 | routeInformation: null, |
| 34 | + temperature: null, | ||
| 35 | + humidity: null, | ||
| 36 | + weather: null, | ||
| 37 | + icon: null, | ||
| 38 | + wind: null, | ||
| 39 | + cloud: null, | ||
| 34 | }; | 40 | }; |
| 35 | } | 41 | } |
| 36 | 42 | ||
| ... | @@ -303,6 +309,35 @@ export default class Home extends Component { | ... | @@ -303,6 +309,35 @@ export default class Home extends Component { |
| 303 | .finally(function () { | 309 | .finally(function () { |
| 304 | // always executed | 310 | // always executed |
| 305 | }); | 311 | }); |
| 312 | + | ||
| 313 | + API.get("airCondition/weather", { | ||
| 314 | + params: { | ||
| 315 | + latitude: position["Ha"], | ||
| 316 | + longitude: position["Ga"], | ||
| 317 | + }, | ||
| 318 | + }) | ||
| 319 | + .then((response) => { | ||
| 320 | + let resp = response["data"]; | ||
| 321 | + console.log(resp); | ||
| 322 | + console.log("현재온도 : " + (resp.main.temp - 273.15)); | ||
| 323 | + console.log("현재습도 : " + resp.main.humidity); | ||
| 324 | + console.log("날씨 : " + resp.weather[0].main); | ||
| 325 | + console.log("상세날씨설명 : " + resp.weather[0].description); | ||
| 326 | + console.log("날씨 이미지 : " + resp.weather[0].icon); | ||
| 327 | + console.log("바람 : " + resp.wind.speed); | ||
| 328 | + console.log("구름 : " + resp.clouds.all + "%"); | ||
| 329 | + this.setState({ | ||
| 330 | + temperature: (resp.main.temp - 273.15).toFixed(3), | ||
| 331 | + humidity: resp.main.humidity, | ||
| 332 | + weather: resp.weather[0].main, | ||
| 333 | + icon: resp.weather[0].icon, | ||
| 334 | + wind: resp.wind.speed, | ||
| 335 | + cloud: resp.clouds.all + "%", | ||
| 336 | + }); | ||
| 337 | + }) | ||
| 338 | + .catch(function (error) { | ||
| 339 | + console.log(error); | ||
| 340 | + }); | ||
| 306 | }; | 341 | }; |
| 307 | let setDepart = document.createElement("Button"); | 342 | let setDepart = document.createElement("Button"); |
| 308 | setDepart.innerHTML = "출발지로 설정하기"; | 343 | setDepart.innerHTML = "출발지로 설정하기"; |
| ... | @@ -400,7 +435,12 @@ export default class Home extends Component { | ... | @@ -400,7 +435,12 @@ export default class Home extends Component { |
| 400 | <br /> 미세먼지 등급 <br /> {pm10Image} <br /> | 435 | <br /> 미세먼지 등급 <br /> {pm10Image} <br /> |
| 401 | 미세먼지 지수 : {this.state.curAirCondition.pm10Value} <br /> | 436 | 미세먼지 지수 : {this.state.curAirCondition.pm10Value} <br /> |
| 402 | 초미세먼지 등급 <br /> {pm25Image} <br /> | 437 | 초미세먼지 등급 <br /> {pm25Image} <br /> |
| 403 | - 초미세먼지 지수 : {this.state.curAirCondition.pm25Value} <br />{" "} | 438 | + 초미세먼지 지수 : {this.state.curAirCondition.pm25Value} <br /> |
| 439 | + 현재 온도 : {this.state.temperature} ℃ <br /> | ||
| 440 | + 현재 습도 : {this.state.humidity} <br /> | ||
| 441 | + 날씨 : {this.state.weather} <br /> | ||
| 442 | + 바람 : {this.state.wind} <br /> | ||
| 443 | + 구름 : {this.state.cloud} <br />{" "} | ||
| 404 | </h5> | 444 | </h5> |
| 405 | ); | 445 | ); |
| 406 | } | 446 | } | ... | ... |
-
Please register or login to post a comment