The following allows a client side web application to communicate with a UDP endpoint.
We create a WebSocket to UDP bridge using websockify and socat.
The connection looks like:
┌────────────────────────┐ ┌──────────────────────────┐ ┌────────────────────┐ ┌────────────────┐ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ Web browser │ │ websockify │ │ socat │ │ │ │ ◄──────► ◄──────► ◄──────► UDP endpoint │ │ (WebSocket endpoint) │ │ (WebSocket-TCP bridge) │ │ (TCP-UDP bridge) │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ └────────────────────────┘ └──────────────────────────┘ └────────────────────┘ └────────────────┘
-
Start websockify. Listen on port 40000. Forward on port 40001.
websockify 40000 localhost:40001
-
Start socat. Listen for TCP traffic on port 40001. Forward UDP traffic on port 40002.
socat tcp-listen:40001,fork udp:localhost:40002
-
Start the UDP client. We’ll use netcat as a standin for our UDP client. Listen on port 40002.
netcat -vvlup 40002
-
Create a WebSocket and send a message. In the web browser Javascript console:
let message = new Blob(["hello world\n"], { type: "text/plain" }); let sock = new WebSocket("ws://localhost:40000", ['binary', 'base64']); sock.send(message); sock.close();
-
Start the UDP client. We’ll use socat to echo the message back to the web browser.
socat udp-listen:40002 exec:'/bin/cat'
-
Create a WebSocket, a message handler, and send a message. In the web browser Javascript console:
let message = new Blob(["hello world\n"], { type: "text/plain" }); let sock = new WebSocket("ws://localhost:40000", ['binary', 'base64']); sock.onmessage = async (event) => { const text = await event.data.text(); console.log(text); } sock.send(message); sock.close();
-
Start a UDP client that sends requests to
/bin/sh
and returns the outputsocat udp-listen:40002 exec:'/bin/sh'
-
Create a WebSocket, a message handler, and send a message. In the web browser Javascript console:
let sock = new WebSocket("ws://localhost:40000", ['binary', 'base64']); sock.onmessage = async (event) => { const text = await event.data.text(); console.log(text); } const send = async (text) => { const message = new Blob([text + "\n"], {type: "text/plain"}); await sock.send(message); } await send("uname -a"); sock.close();