This is a forked and tweaked version of Embed streaming Streaming into a webpage Webpage (no iframe solution) for a streaming ui UI implementation using react library.
Method 2 of this document can be used without changing the source code of the target application. By simply using the server provided in this doc, we can achieve single use token system.
...
For this tutorial, you must use this cp Control Panel for now:https://controlpanel.eagle3dstreaming.com
This document describes guidelines on how to use the E3DS core library for a frontend application to stream a UE app inside the web application. To make the system work one must have an account in the E3DS platform, upload a UE app, and create a configuration in the control panel.
...
When a browser tries to fetch the index.html, the server queries the token from e3ds server and injects into the html along with clientUserName and serves it to the browser.Expand
| title | Useful global functions |
|---|
Here is a list of useful global functions. These functions will be called from the core library if they are defined in global scope. Inside functions required operation can be done for the functionality of the web app.
| Code Block |
|---|
e3ds_controller.callbacks.onDataChannelOpen = function () {
console.log("ob-onDataChannelOpen");
}
e3ds_controller.callbacks.onDataChannelClose = function () {
console.log("ob-onDataChannelClose");
}
e3ds_controller.callbacks.onConfigAcquire = function () {
console.log("ob-onConfigAcquire");
}
e3ds_controller.callbacks.onSessionExpired = function () {
self.location = "assets/pages/session-expired.htm";
}
e3ds_controller.callbacks.onResponseFromUnreal = function (descriptor) {
console.log("ob-onResponseFromUnreal");
console.log("UnrealResponse: " + descriptor);
document.getElementById('LatencyStats').innerHTML = descriptor;
}
e3ds_controller.callbacks.onReceivingAppAcquiringProgress = function (percent) {
console.log("onReceivingAppAcquiringProgress: " + percent);
}
e3ds_controller.callbacks.onReceivingAppPreparationProgress = function (percent) {
console.log("onReceivingAppPreparationProgress: " + percent);
}
e3ds_controller.callbacks.onReceivingAppStartingProgress = function (percent) {
console.log("onReceivingAppStartingProgress: " + percent);
}
e3ds_controller.callbacks.onHtmlBind = function () {
console.log("ob-onHtmlBind");
} |
onConfigAcquire : called when configuration data arrives
onDataChannelOpen: called then communication channel between the browser and UE app is established
onDataChannelClose: called then communication channel between the browser and UE app is broken
onSessionExpired: called when stream session time expires
onHtmlBind: when system finish binding function to existed stick Ui elements
Useful Global Functions:
Useful Global Functions in No-Iframe Solution
...
| Expand | ||
|---|---|---|
| ||
To send message to UE app from the web app call “e3ds_controller.sendToUnreal” .
|