Unreal Engine | Remote Control

WebSocket

You can enable websocket communication in your game by creating a Twikit Web Socket Communication object and setting it on the Twikit Communication Subsystem. This will start a websocket listening on ws://0.0.0.0:5555:

The WebSocket connection supports the following operations:

• Loading a product

• Retrieving information for all parameters in the product

• Setting product parameter values

Common use cases for the WebSocket connection include embedding Unreal Engine streaming on a webpage, connecting a tablet to a point-of-sale game, and connecting to a VR experience.

Secure WebSocket

Browsers require WebSocket connections to be secure (wss). The socket listener provided by Unreal Engine — and used by the Twikit plug-in — is not secure and listens on plain ws. To expose a secure connection, a reverse proxy is required.

See Unreal Engine | Secure WebSocket: nginx Setup for step-by-step instructions covering both Linux and Windows. The setup proxies incoming wss traffic on port 5000 to the internal insecure listener on port 5555, so only port 5000 needs to be open to the outside world.

Custom Communication

You can set up custom communication for the Twikit Unreal Plugin. Create a Twikit Custom Communication object and set it on the Twikit Communication Subsystem:

Bind the OnMessageToSend event to process messages the plugin wants to send. Call the Handle Message function on the plugin to send messages to the plugin. In the above example we simply log messages the plugin wants to send, we send it a manual event string (setting the logo verbosity) on the keypress K.

For custom communication on the front-end side, bypassing facade’s built-in websocket, you do e.g.:

  const testSocket = new WebSocket('ws://localhost:5555');
  const testTransport = {
      onOpen: (cb) => testSocket.addEventListener('open', cb),
      onMessage: (cb) => testSocket.addEventListener('message', async (event) => { cb(await event.data.text()) }),
      send: (data) => testSocket.send(data),
      close: () => testSocket.close(),
  };

  opts.workerConfig = testTransport;

The raw data coming from our Unreal websocket implementation is Blob, converted to string above with await … text(). Update as needed. The signature is:

interface ITwikbotTransport {
    onOpen(cb: () => void): void;
    onMessage(cb: (data: string) => void): void;
    send(data: string): void;
    close?(): void;
}

close is optional, leave unimplemented or empty if you don’t need custom cleanup here.