Sending and receiving data

Your page and your Unreal application can talk to each other in both directions. This page covers all four cases, for both the SDK and the iframe, so you can see them side by side rather than choosing a method first.

Before you begin

Page → Unreal

With the SDK

One call. Whatever you pass arrives in your app.

e3ds_controller.sendToUnreal("This message is sent by the frontend");

// objects work too
e3ds_controller.sendToUnreal({ Character: "Aurora" });

With an iframe

You post a message to the frame, and the message must be a JSON string carrying a specific command key: 

const message = {
  cmd: "sendDataToUE",          // required, exactly this
  value: { message: "Hello World!" }
};
// Send it as a STRING. A plain object is dropped without an error.
document.getElementById("iframe_1").contentWindow
  .postMessage(JSON.stringify(message), "*");

Unreal → page

In Unreal, either way

The Unreal side is identical for both integration methods. In the Blueprint where the event happens:

  1. Add a Pixel Streaming Input component

    Open the Actor Blueprint, press Add Component in the Components panel, and add Pixel Streaming Input. Without it the node below has nothing to send through.

  2. Call Send Pixel Streaming Response

    Right-click in the graph, add Send Pixel Streaming Response, and give it the string you want the page to receive.

Receiving it, with the SDK

e3ds_controller.callbacks.onResponseFromUnreal = function (descriptor) {
  console.log("Message from Unreal:", descriptor);
};

Assign it before the stream starts. Callbacks are optional — the ones you do not define are simply never called — but one assigned late has already missed whatever arrived first.

Receiving it, in an iframe

Listen for messages from the frame and read the payload the same way you would any postMessage. What your Blueprint sent is the message itself, event.data, exactly as sent — not wrapped in another field: 

window.addEventListener("message", function (event) {
  console.log("From Unreal:", event.data);
});

The frame also posts its own status messages (they carry a type), so check the shape before treating a message as yours.

Which to use for what

You want toUse
Send your own data — a name, a colour, a choice sendToUnreal, and handle it in your Blueprint
Change something the platform understands, such as resolution sendCommandToUE
Run an Unreal console command sendConsoleCommandToUE

The distinction matters: sendToUnreal reaches your code and does whatever you wrote. The other two reach the engine and the platform, and do fixed things.

Send a message from your webpage to Unreal with the SDKWatch on YouTube

Last updated