node.js에서 두 클라이언트 간의 통신

Question

현재 상황 : arduino -> node.js -> react 순으로 값을 보낼 수 있으며arduino에서는 node.js에서 설정한 임의의 값을 받을 수 있음.하지만 현재 react에서 값을 보낼 경우 node.js에서의 지식이 없어 서버가 이를 받아 arduino로 보내는 방법을 모름 (chatGPT는 이상한 소리만...)방법이 있을까요?arduino#include #include #include const char *serverUrl = "http://192.168.151.160:3001/send-data"; char val = 'n'; WiFiClient client; void setup() { Serial.begin(115200); WiFiManager wifiManager; wifiManager.autoConnect("AutoConnectAP"); Serial.println("Connected to WiFi"); } void loop() { if(Serial.available()){ val = Serial.read(); Serial.print(val); } httpRequest(val); delay(100); } void httpRequest(int val) { HTTPClient http; http.begin(client, serverUrl); // Pass the WiFiClient instance http.addHeader("Content-Type", "application/x-www-form-urlencoded"); String postData = "val=" + String(val); int httpResponseCode = http.POST(postData); //서버로부터 값을 보냄 if (httpResponseCode == HTTP_CODE_OK) { String payload = http.getString(); //서버로부터 값을 받음 Serial.print("HTTP Response code: "); Serial.println(httpResponseCode); Serial.print("Response: "); Serial.println(payload); } else { Serial.print("Error on HTTP request. Response code: "); Serial.println(httpResponseCode); } http.end(); delay(10); } node.jsconst express = require('express'); const bodyParser = require('body-parser'); const app = express(); const port = 3001; app.use(bodyParser.urlencoded({ extended: true })); let arduinoValue = null; app.use((req, res, next) => { res.header('Access-Control-Allow-Origin', '*'); res.header('Access-Control-Allow-Methods', 'POST'); res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept'); next(); }); app.post('/send-data', (req, res) => { arduinoValue = req.body.val; console.log('Received val from Arduino:', arduinoValue); res.send('Value received successfully.'); //서버에서 임의로 설정한 값을 보냄 console.log('Forwarding value to React:', arduinoValue); }); app.get('/get-data', (req, res) => { res.json({ value: arduinoValue }); }); app.listen(port, () => { console.log(`Server is running on port ${port}`); });reactimport React, { useState, useEffect } from 'react'; import axios from 'axios'; const App = () => { const [val, setVal] = useState(null); const [maxDrink, setMaxDrink] = useState(0); // 이 값을 보낼 예정 const [send, setSend] = useState(false); useEffect(() => { const fetchData = async () => { try { const response = await axios.get('http://localhost:3001/get-data'); setVal(response.data.value); // Extract value from response data } catch (error) { console.error('Error fetching data:', error); } }; fetchData(); const interval = setInterval(() => { fetchData();} , 100); return () => clearInterval(interval); }); return (

Value from ESP8266:

{val !== null ? `Value: ${val}` : 'Loading value...'}

{return setMaxDrink(e.target.value)}}/>

); }; export default App;

Hee Sung Son · Accepted Answer

일단 아두이노는 요청(request)만 할뿐 받는 경로(route)가 없습니다. 즉 서버가 아니라 클라이언트 기능만 있을 뿐입니다.아두이노가 데이터를 받으려면 우선 경로(route)가 있는 서버형태로 띄워야하며여기까지 한경우 react에서 nodejs 거치지 않고도 바로 데이터를 보낼 수 있습니다.(선택)nodejs에서만 보내게 하려면 nodejs에서만 호출하고, react에서는 nodejs를 호출하여 받는 형태로 만드시면 됩니다.

node.js에서 두 클라이언트 간의 통신

1개의 답변

기술 목록