In this document, we will guide you on how to embed streaming within your React webpage without using an iframe script.
To assist with this, we have provided a Node.js application that utilizes our Token API. You can find it in the following GitHub repository:
Follow the steps below:
Step 1. Clone the Repository
Run the following command to clone the specific branch directly:
git clone --branch reactJs https://github.com/e3ds/full-html-control.git
Step 2. Install Necessary Packages
Navigate into the cloned project folder and install dependencies:
npm install
Step 3. Navigate to the cloned project folder and open the file server.js
Step 4. Update the Required Information Inside server.js
apiKey: Your Streaming API Key - Get Streaming API Key
domain: If you are using production system then domain would be “connector.eagle3dstreaming.com“. If you are provided with a dedicated system, then domain would be the domain of that dedicated system.
clientUserName: Your username on the Eagle 3D Streaming Platform
appName: The name of the app you want to embed into your website (as listed on the Eagle 3D Streaming Platform)
configurationName: The name of the configuration you want to use for the app
Step 5. Build the React Project
Run the following command to compile the React application:
npm run build
Step 6. Start the Server
Now, start the token server:
npm run runserver
Step 7. Launch in Browser
Once the server is running, open your browser and visit:
http://localhost:3000
If all information has been correctly configured, the session should start automatically.
After few seconds the stream started
To learn how to communicate between your Unreal Engine app and the webpage (e.g., sending messages or triggering actions), please refer to the documentation here:
Communication Between Unreal App and Webpage
Ask questions and help your peers Community Forum
Need help? Contact Support
Facebook | GitHub | LinkedIn | YouTube