반응형
Node-RED에서 WebSocket In과 WebSocket Out 노드는 WebSocket 프로토콜을 사용하여 실시간 데이터 전송을 처리하는 노드들입니다. WebSocket은 HTTP 기반의 양방향 통신 프로토콜로, 클라이언트와 서버가 지속적으로 연결된 상태를 유지하면서 실시간으로 데이터를 주고받을 수 있습니다.
WebSocket In 노드
WebSocket In 노드는 WebSocket 클라이언트 또는 서버로부터 메시지를 수신하는 역할을 합니다. 이를 통해 Node-RED 플로우가 WebSocket 연결로 들어오는 데이터를 받아 처리할 수 있습니다.
주요 기능:
- 서버 모드: WebSocket In 노드를 서버 모드로 설정하면, Node-RED는 WebSocket 서버 역할을 하여 클라이언트들이 연결을 맺고 데이터를 전송할 수 있습니다.
- 클라이언트 모드: WebSocket In 노드를 클라이언트 모드로 설정하면, Node-RED는 외부 WebSocket 서버에 연결하여 해당 서버로부터 데이터를 수신합니다.
- 메시지 수신: WebSocket 연결로 들어오는 메시지를 Node-RED 플로우에서 처리할 수 있습니다.
설정 옵션:
- Type:
- Listen on: Node-RED가 WebSocket 서버로 동작하며, 클라이언트들이 연결할 수 있도록 합니다.
- Connect to: Node-RED가 WebSocket 클라이언트로 동작하며, 외부 WebSocket 서버에 연결합니다.
- URL: WebSocket 연결을 수신할 서버 주소 또는 연결할 서버 주소를 설정합니다. 예를 들어, ws://localhost:1880/ws/chat.
- Name: 노드의 이름을 지정할 수 있습니다.
WebSocket Out 노드
WebSocket Out 노드는 WebSocket 연결을 통해 데이터를 전송하는 역할을 합니다. WebSocket Out 노드는 WebSocket In 노드에서 연결된 클라이언트나 서버로 데이터를 전송할 수 있습니다.
주요 기능:
- 서버 모드에서 전송: WebSocket Out 노드는 WebSocket 서버 역할을 하는 Node-RED 인스턴스에서 연결된 클라이언트들에게 데이터를 보낼 수 있습니다.
- 클라이언트 모드에서 전송: WebSocket Out 노드는 WebSocket 클라이언트로 설정되어 외부 WebSocket 서버에 데이터를 전송할 수 있습니다.
- 실시간 데이터 송신: WebSocket Out 노드를 사용하여 실시간 데이터를 송신할 수 있습니다. 예를 들어, 센서 데이터, 상태 업데이트, 채팅 메시지 등을 클라이언트에게 전송할 수 있습니다.
설정 옵션:
- Type:
- Listen on: WebSocket Out 노드가 WebSocket 서버로 동작하여 연결된 클라이언트들에게 메시지를 전송합니다.
- Connect to: WebSocket Out 노드가 외부 WebSocket 서버에 연결되어 메시지를 전송합니다.
- URL: WebSocket 연결을 통해 데이터를 전송할 서버 주소 또는 연결된 클라이언트들에게 데이터를 보낼 수 있는 주소를 설정합니다.
- Name: 노드의 이름을 지정할 수 있습니다.
다음은 Node-RED를 사용하여 간단한 실시간 채팅 애플리케이션을 구현하는 예제입니다. 이 예제에서는 WebSocket In과 WebSocket Out 노드를 사용하여 실시간 메시지를 주고받을 수 있습니다. Node-RED 대시보드에서 메시지를 입력하고, 다른 사용자가 메시지를 실시간으로 볼 수 있는 형태로 만들겠습니다.
Node-RED 플로우 구성
- WebSocket In 노드: 클라이언트가 WebSocket을 통해 보내는 메시지를 수신합니다.
- Function 노드: 메시지를 처리합니다(예: 사용자 이름을 추가하거나 메시지를 형식화).
- WebSocket Out 노드: 수신된 메시지를 연결된 다른 클라이언트들에게 실시간으로 전송합니다.
- Dashboard 노드: 대시보드에서 채팅 메시지를 표시하고 새로운 메시지를 입력할 수 있습니다.
플로우 구성
플로우 JSON
[
{
"id": "websocket_in",
"type": "websocket in",
"z": "2afd894e488b653d",
"name": "WebSocket In",
"server": "a9168a310b0c75ac",
"client": "",
"x": 170,
"y": 100,
"wires": [
[
"function_format_message",
"10e2f22f799c357d"
]
]
},
{
"id": "function_format_message",
"type": "function",
"z": "2afd894e488b653d",
"name": "Format Message",
"func": "try {\n // msg.payload가 JSON 형식의 문자열로 들어오므로 객체로 변환\n var data = JSON.parse(msg.payload);\n\n // 사용자 이름과 메시지 가져오기\n var user = data.user || 'Anonymous';\n var text = data.text || '';\n\n // 메시지를 형식화하여 msg.payload에 저장\n msg.payload = user + ': ' + text;\n} catch (error) {\n // JSON 파싱에 실패하면 기본 메시지 출력\n msg.payload = 'Invalid data format';\n}\n\nreturn msg;",
"outputs": 1,
"timeout": "",
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 470,
"y": 100,
"wires": [
[
"websocket_out",
"ui_text_area"
]
]
},
{
"id": "websocket_out",
"type": "websocket out",
"z": "2afd894e488b653d",
"name": "WebSocket Out",
"server": "",
"client": "2959a1da26fd8b99",
"x": 900,
"y": 100,
"wires": []
},
{
"id": "ui_form",
"type": "ui_form",
"z": "2afd894e488b653d",
"name": "Message Input",
"label": "Chat Form",
"group": "da6fcc7da8733bcb",
"order": 2,
"width": "6",
"height": "1",
"options": [
{
"label": "User",
"value": "user",
"type": "text",
"required": true,
"rows": null
},
{
"label": "Message",
"value": "text",
"type": "text",
"required": true,
"rows": null
}
],
"formValue": {
"user": "",
"text": ""
},
"payload": "",
"submit": "보냄",
"cancel": "취소",
"topic": "",
"topicType": "str",
"splitLayout": true,
"className": "",
"x": 680,
"y": 340,
"wires": [
[
"websocket_out"
]
]
},
{
"id": "ui_text_area",
"type": "ui_text",
"z": "2afd894e488b653d",
"group": "da6fcc7da8733bcb",
"order": 1,
"width": "6",
"height": "4",
"name": "Chat Display",
"label": "Chat",
"format": "{{msg.payload}}",
"layout": "row-spread",
"className": "",
"style": false,
"font": "",
"fontSize": "",
"color": "#000000",
"x": 670,
"y": 240,
"wires": []
},
{
"id": "10e2f22f799c357d",
"type": "debug",
"z": "2afd894e488b653d",
"name": "debug 1",
"active": true,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "false",
"statusVal": "",
"statusType": "auto",
"x": 360,
"y": 180,
"wires": []
},
{
"id": "a9168a310b0c75ac",
"type": "websocket-listener",
"path": "/ws/chat",
"wholemsg": "false"
},
{
"id": "2959a1da26fd8b99",
"type": "websocket-client",
"path": "ws://localhost:1880/ws/chat",
"tls": "",
"wholemsg": "false",
"hb": "0",
"subprotocol": ""
},
{
"id": "da6fcc7da8733bcb",
"type": "ui_group",
"name": "Default",
"tab": "129055a93ab84abe",
"order": 1,
"disp": true,
"width": "6",
"collapse": false,
"className": ""
},
{
"id": "129055a93ab84abe",
"type": "ui_tab",
"name": "Home",
"icon": "dashboard",
"disabled": false,
"hidden": false
}
]
반응형
'컴퓨터|인터넷 > 라즈베리파이' 카테고리의 다른 글
| Node-red: Chart in dashboard (2) | 2024.10.03 |
|---|---|
| Node-red: Gauge in Dashboard (노드래드 대시보드 게이지의 활용) (0) | 2024.10.03 |
| Node-red: http in (2) | 2024.10.03 |
| MQTT Python client (0) | 2024.09.22 |
| Node-red 설치 (0) | 2024.09.22 |
댓글