Space for Fakhrul Islam

Send Data from Webpage to Unreal App

In this guide, we’ll show you how to send data from a webpage (sender) to an Unreal Engine application (receiver).




Prerequisites:







Follow the steps below:


Step 1. Create the Json Object

Prepare the data you want to send as a valid JSON object.

{
    "message": "Hello World!"
}












Step 2. Parse the JSON

Convert the JSON string into a JavaScript object before sending it:

let obj = { "message": "Hello World!" };
obj = JSON.parse(JSON.stringify(obj)); // ensure object format













Step 3. Send the Message to Unreal Engine

Use the e3ds_controller.sendToUnreal() method to send the object to the Unreal app:

e3ds_controller.sendToUnreal(obj); // send to ue


e3ds_controller is provided by the Eagle 3D Streaming library: https://e3ds.github.io/public-release/e3dsCore.min.js


Ensure that your HTML page includes the E3DS Core Library:

<script src="https://e3ds.github.io/public-release/e3dsCore.min.js"></script>










Full Example Code

<div style="margin-bottom: 10px">
 <!-- Input field for user to enter JSON message -->
  <input
    type="text"
    id="teleportInput"
    placeholder='Enter JSON (e.g. {"message":"Hello World!"})'
    style="padding: 5px; font-size: 14px"
  />
   <!-- Button to trigger sending message to Unreal -->
  <button
    onclick="handleButtonClick()"
    style="padding: 6px 12px; font-size: 14px"
  >
    Send Message to Unreal
  </button>
</div>


<script>
  function handleButtonClick() {
     // Get the value entered in the input field
      const jsonToSendToUnreal = document.getElementById("teleportInput").value;

      // Parse the input string into a JavaScript object
      const obj = JSON.parse(jsonToSendToUnreal);

      // Send the object to the Unreal Engine application via E3DS controller
      e3ds_controller.sendToUnreal(obj);
  }
</script>









 


Need help?

🛠️ Contact our Support Team

💬 Join the Community on Discord

🆓 Get Started for free

 

Follow us on:

Facebook | GitHub | LinkedIn | YouTube