App.js
2.75 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
// import axios from 'axios';
import React from 'react'
function getData() {
return new Promise(function (resolve, reject) {
navigator.geolocation.getCurrentPosition(function (position) {
let lat = position.coords.latitude;
let lon = position.coords.longitude;
resolve({ lat, lon });
})
})
}
class App extends React.Component {
// constructor(props) {
// super(props);
// this.findWeather = this.findWeather.bind(this);
state = {
id: "",
}
// }
handleChange = (e) => {
this.setState({
[e.target.name]: e.target.value,
});
}
findWeather = () => {
var weatherData = -1;
this.setState({
id: "검색한 값: " + this.state.id,
})
getData() // 위치 정보 가져옴
.then(function (object) {
console.log(object.lat, object.lon);
return { latitude: object.lat, longitude: object.lon };
}) // 밑으로 위도, 경도 객체 넘김
.then(function (result) {
fetch("http://localhost:3001/weather", { // 위도, 경도 정보를 바탕으로 날씨정보 가져옴
method: "post",
headers: {
"content-type": "application/json",
},
body: JSON.stringify({ lat: result.latitude, lon: result.longitude }),
}) // '날씨' 만 가져와 아래로 넘김
.then((res) => res.json())
.then((json) => {
console.log("클라이언트가 받은 값(날씨)은 : ", json);
weatherData = json;
return weatherData;
})
.then((data) => {
console.log("넘어온 데이터는 : ", data);
if (data === 0) { // 맑을 경우 디비 호출
fetch(`http://localhost:3001/database0`, {
method: "post",
headers: {
"content-type": "application/json",
},
body: JSON.stringify(),
})
.then((res) => res.json())
.then((json) => {
console.log(json);
})
}
else { // 비/눈이 올 경우 디비 호출
fetch(`http://localhost:3001/database1`, {
method: "post",
headers: {
"content-type": "application/json",
},
body: JSON.stringify(),
})
.then((res) => res.json())
.then((json) => {
console.log(json);
})
}
})
})
}
render() {
return (
<div>
<input onChange={this.handleChange} name="id" />
<button onClick={this.findWeather}>Run</button>
<h1>{this.state.id}</h1>
</div>
)
}
}
export default App;