こんにちは。
kafka-proxy-wsを見つけたので、react-websocket（クライアント App.js）へデータを渡してみました。ただし、"1\n2\n3"を渡して結果表示を見ると、最後の 3だけが処理されたように見えました（加算が 3だけです）。
Count: 1 → 4 → 7
$mkdir kafkaProxy
$cd kafkaProxy
$ vi server.js
$ vi package.json
$ npm install$ node server.js &
$echo-e"1\n2\n3" | kafkacat -P-b localhost -ttest$echo-e"1\n2\n3" | kafkacat -P-b localhost -ttest$ npx create-react-app react-websocket
$cd react-websocket
$ vi src/App.js
$ npm start
App.js
importReact,{useState}from'react';importWebsocketfrom'react-websocket';functionApp(){const[count,setCount]=useState(1);functionhandleData(data){JSON.parse(data).forEach(res=>{setCount(count+Number(res.message));});}return(<div>Count:<strong>{count}</strong>
<Websocketurl='ws://localhost:9999/?topic=test&consumerGroup=group1'onMessage={handleData.bind(this)}/>
</div>
);}exportdefaultApp;server.js
'use strict';constKafkaProxy=require('kafka-proxy');letkafkaProxy=newKafkaProxy({wsPort:9999,kafka:'localhost:9092/',});kafkaProxy.listen();package.json
{"name":"kafkaProxy","version":"1.0.0","scripts":{},"description":"WebSockets based proxy for Kafka","author":"lawrips <lawrips@microsoft.com>","dependencies":{"debug":"^2.2.0","kafka-proxy":"^1.0.0","no-kafka":"^2.5.5","path-to-regexp":"^1.2.1","ws":"^1.0.1"},"main":"server.js","devDependencies":{"commander":"^2.9.0","should":"^9.0.2"},"repository":{"type":"git","url":"https://github.com/Microsoft/kafka-proxy-ws.git"},"keywords":["kafka","proxy","reverse proxy","ws","websockets","websocket","socket","sockets"],"license":"MIT"}