sudo apt-get update
sudo apt-get install nodejs
sudo apt-get install npm
mkdir my_project
cd my_project
nano server.js
const io = require("socket.io")(3001, {
cors: {
origin: "http://localhost:3000",
methods: ["GET", "POST"],
},
});
io.on("connection", (socket) => {
console.log("A user connected");
// Handle barcode data
socket.on("barcode", (data) => {
console.log(`Received barcode: ${data}`);
// Do something with the barcode data here
});
socket.on("disconnect", () => {
console.log("A user disconnected");
});
});
http://localhost:3000
에서 요청을 수락하는 CORS 설정을 적용합니다.npm install socket.io-client
import io from 'socket.io-client';
const socket = io('{http://}'); // 라즈베리파이 IP 주소에 맞게 수정
export default socket;
import React, { useEffect, useState } from 'react';
import './App.css';;
import io from 'socket.io-client';
import socket from './socket';
function App() {
const [data, setData] = useState(null);
useEffect(() => {
socket.on('connect', () => {
console.log('connected to server');
});
socket.on('disconnect', () => {
console.log('disconnected from server');
});
// 소켓 이벤트 리스너 등록
socket.on('barcode', (barcodeData) => {
setData(barcodeData);
});
// 컴포넌트 unmount 시, 소켓 이벤트 리스너 제거
return () => {
socket.off('barcode');
};
}, []);
return (
<div>
{data ? (
<div>
<h1>Barcode Data</h1>
<p>{data}</p>
</div>
) : (
<p>No data yet.</p>
)}
</div>
);
}
export default App;
node server.js
npm start