Set Up Custom Session Expired Screen

This guide explains how to replace the default Eagle 3D Streaming session expired screen with your own custom fullscreen image.

Overview

By default, the SDK automatically shows its own “Session Expired” page when the session ends.

Using the callback below, you can display your own custom branded screen instead:

e3ds_controller.callbacks.onSessionExpired

Follow the steps below:

Step 1. Prepare Your Session Expired Image

Prepare a fullscreen image for the session expired state.

Recommended size:

1920 × 1080

You can host the image:

• locally
  OR

• using public image hosting

Example direct image URL:

https://i.ibb.co.com/example/session-expired.png

Important: Use the direct image URL, not the image page URL.

Step 2. Add the Session Expired Callback

Add the following code inside your scripts_demo.js file:

e3ds_controller.callbacks.onSessionExpired = function ()
{
    console.log("Session Expired");

    // Clear entire page
    document.documentElement.innerHTML = "";

    // Create body again
    const body = document.createElement("body");

    body.style.margin = "0";
    body.style.overflow = "hidden";

    // Create image
    const img = document.createElement("img");

    img.src = "YOUR_DIRECT_IMAGE_URL";

    img.style.position = "fixed";
    img.style.top = "0";
    img.style.left = "0";
    img.style.width = "100vw";
    img.style.height = "100vh";
    img.style.objectFit = "cover";
    img.style.zIndex = "999999";

    body.appendChild(img);

    document.documentElement.appendChild(body);

    // Stop SDK rendering flow
    window.stop();

    // Prevent SDK redirect
    throw new Error("SessionExpiredStop");
}

Replace:

YOUR_DIRECT_IMAGE_URL

with your actual image URL.

Example:

img.src = "https://i.ibb.co.com/JW0zGP4b/session-expired.png";

Why window.stop() and throw new Error() are Required

The SDK internally continues rendering and redirects to its own default session expired page after the callback executes.

Using:

window.stop();

stops further browser rendering/network execution.

Using:

throw new Error("SessionExpiredStop");

interrupts the SDK flow and prevents the default session-expired renderer from replacing your custom screen.

Without these lines:

• your custom image may appear briefly

• then the SDK will replace it with the default session expired page

Alternative Implementation

You can also redirect users to a separate custom HTML page instead of rendering the image directly inside the callback. This method is cleaner and helps avoid the SDK re-rendering the default session expired screen.

Example:

e3ds_controller.callbacks.onSessionExpired = function ()
{
    window.location.href = "assets/pages/my-session-expired.html";
}

Troubleshooting

Need help?

If you need any assistance, feel free to reach out through any of the following channels:

🛠️ Support Portal: Contact Our Support Team

💬 Discord Community (Faster Support): Join Our Discord Community

📧 Email Support: support@eagle3dstreaming.com

🆓 Get Started for free

Follow us on:

Facebook | GitHub | LinkedIn | YouTube