Run the Solution

Now that we have the necessary applications built, we can explore how to stream the USD Viewer application into the web client.

Hardware-accelerated GPU Scheduling

On Windows computers there is a setting that controls how GPU resources are provided to applications. Follow the instructions to turn off Hardware accelerated GPU scheduling in Stream on a Workstation to ensure USD Viewer can utilize the GPU even when it is not in focus.

Run Headless

Kit applications can run headless. There is no difference in its capabilities in headless mode and the startup procedure of the streaming solution remains the same.

Windows

Run the application bat file with the -no-window argument. You can find the bat file in the project’s _build\[platform]\release directory.

my_company.my_usd_viewer.kit.bat -no-window

Linux

Run the application sh file with the -no-window argument. You can find the sh file in the project’s _build\[platform]\release directory.

./my_company.my_usd_viewer.kit.sh -no-window

Reset User Settings

As you iterate on USD Viewer, you may change settings in the various “Settings” sections. Some settings persist in a user settings file and may override your new settings. To clear the user settings, you can run the application with a –reset-user argument.

Windows

You can find the bat file in the project’s _build\[platform]\release directory.

my_company.my_usd_viewer.kit.bat -reset-user

Linux

You can find the sh file in the project’s _build\[platform]\release directory.

my_company.my_usd_viewer.kit.sh -reset-user

Peer-to-Peer Streaming

For peer-to-peer streaming of the samples in this example, you can use either a single workstation or stream from one workstation to another.

Single Workstation

The samples in this example are configured to run on a single workstation. To run the solution:

Start USD Viewer by using the repo launch command in the project root. Select the kit file with the streaming suffix.

Wait for the USD Viewer viewport to display in black.

Start the web client by using the npm run dev command in the project root.

Copy the URL that displays in the command prompt window and paste it in your Chrome or Edge browser.

Note

This example provides a peer-to-peer streaming solution. One USD Viewer can be streamed to one client. If you open many browser tabs, then only one can use the streamed application at any given time.

One Workstation to Another

To stream the Kit application from one computer to another computer running the client, we need to make sure the two applications can access each other. This requires opening some ports and a configuration change of the client.

Configure Computer Running Kit Application

The Kit application needs the ability to send and receive messages via TCP and ability to send the pixel stream over UDP.

Below are example commands for opening ports in the firewall.

Open Ports on Ubuntu 22.04

Open a terminal to run these commands.

# Open ports for app streaming
sudo ufw allow 49100/tcp comment ‘incoming app streaming message traffic’
sudo ufw allow out 49100/tcp comment ’outgoing app streaming message traffic’
sudo ufw allow out 1024:65535/udp comment ‘outgoing app pixel stream’

# (Optional) Inspect all rules
sudo ufw status

# Reload the rules
sudo ufw reload

Open Ports on Windows 10 & 11

Run a PowerShell as Administrator and execute these commands:

# Open ports for app streaming
if (-not (Get-NetFirewallRule -DisplayName "Incoming App Streaming Message Traffic")) {
    New-NetFirewallRule -DisplayName "Incoming App Streaming Message Traffic" -Direction Inbound -LocalPort 49100 -Protocol TCP -Action Allow
    Write-Host "Created rule: Incoming App Streaming Message Traffic"
} else {
    Write-Host "Firewall rule 'Incoming App Streaming Message Traffic' already exists."
}

if (-not (Get-NetFirewallRule -DisplayName "Outgoing App Streaming Message Traffic")) {
    New-NetFirewallRule -DisplayName "Outgoing App Streaming Message Traffic" -Direction Outbound -LocalPort 49100 -Protocol TCP -Action Allow
    Write-Host "Created rule: Outgoing App Streaming Message Traffic"
} else {
    Write-Host "Firewall rule 'Outgoing App Streaming Message Traffic' already exists."
}

if (-not (Get-NetFirewallRule -DisplayName "Outgoing App Pixel Stream")) {
    New-NetFirewallRule -DisplayName "Outgoing App Pixel Stream" -Direction Outbound -LocalPort 1024-65535 -Protocol UDP -Action Allow
    Write-Host "Created rule: Outgoing App Pixel Stream"
} else {
    Write-Host "Firewall rule 'Outgoing App Pixel Stream' already exists."
}

# (Optional) Inspect all rules
Get-NetFirewallRule

Configure Computer Running Client Application

A client also needs to be able to send messages over TCP and be able to receive the pixel stream over UDP.

Below are example commands for opening ports.

Open Ports on Ubuntu 22.04

Open a terminal to run these commands.

# Open ports for app streaming
sudo ufw allow 49100/tcp comment ‘incoming app streaming message traffic’
sudo ufw allow out 49100/tcp comment ‘outgoing app streaming message traffic’
sudo ufw allow 1024:65535/udp comment ‘incoming app pixel stream’

# (Optional) Inspect all rules
sudo ufw status

# Reload the rules
sudo ufw reload

Open Ports on Windows 10 & 11

Run a PowerShell as Administrator and execute these commands:

# Open ports for app streaming
if (-not (Get-NetFirewallRule -DisplayName "Incoming App Streaming Message Traffic")) {
    New-NetFirewallRule -DisplayName "Incoming App Streaming Message Traffic" -Direction Inbound -LocalPort 49100 -Protocol TCP -Action Allow
    Write-Host "Created rule: Incoming App Streaming Message Traffic"
} else {
    Write-Host "Firewall rule 'Incoming App Streaming Message Traffic' already exists."
}

if (-not (Get-NetFirewallRule -DisplayName "Outgoing App Streaming Message Traffic")) {
    New-NetFirewallRule -DisplayName "Outgoing App Streaming Message Traffic" -Direction Outbound -LocalPort 49100 -Protocol TCP -Action Allow
    Write-Host "Created rule: Outgoing App Streaming Message Traffic"
} else {
    Write-Host "Firewall rule 'Outgoing App Streaming Message Traffic' already exists."
}

if (-not (Get-NetFirewallRule -DisplayName "Incoming App Pixel Stream")) {
    New-NetFirewallRule -DisplayName "Incoming App Pixel Stream" -Direction Inbound -LocalPort 1024-65535 -Protocol UDP -Action Allow
    Write-Host "Created rule: Incoming App Pixel Stream"
} else {
    Write-Host "Firewall rule 'Incoming App Pixel Stream' already exists."
}

# (Optional) Inspect all rules
Get-NetFirewallRule

Route Client

The client has a stream.config.json that specifies the server to connect to. The server address should be the IP address of the computer running the Kit application. By default the address is 127.0.0.1 for connecting to a Kit application running on the same computer as the client.

Retrieve the IP address on Windows:

Open a PowerShell.
Execute ipconfig /all
Inspect the list of IP addresses and select the one accessible by the computer that will run the client.

Retrieve the IP address on Linux:

Open a Terminal.
Execute hostname -I
Inspect the list of IP addresses and select the one accessible by the computer that will run the client.

Enter the retrieved IP into the server attribute of the stream.config.json file. The next time the client runs it will attempt to connect to the “remote” computer and start the stream.

In the example stream.config.json below, the default 127.0.0.1 IP address has been replaced with 192.168.50.88, which is the IP address of the computer running the Kit application:

This snippet is written in JSON

{
"$comment": "source can be either 'gfn' or 'local'",
"source": "local",
"gfn": {
   "$comment": "Required props if source is set to 'gfn'.",
   "catalogClientId": "",
   "clientId": "",
   "cmsId":
},
"local": {
   "$comment": "Required props if source is set to 'local'.",
   "server": "192.168.50.88"
}
}

The startup procedure and functionality is the same as is described in Single Workstation.

If opening the ports and configuring the client server address still does not work, then the problem is most likely due to a network access problem. Please contact your IT administrator to resolve this issue.

Customize Ports Used by Kit Application

Some situations requires using ports other than the default Kit ports.

There are settings for what ports are used by Kit that can be customized via settings in the .kit file or via the command line arguments launching the application.

Below are the .kit file settings that can be used to customize the ports:

[settings]
app.livestream.port = XXXXX # defaults to 49100, this is the 'signaling' port
app.livestream.fixedHostPort = XXXXX # defaults to 1024
app.livestream.minHostPort = XXXXX # defaults to 1024, only used if fixedHostPort==0
app.livestream.maxHostPort = XXXXX # defaults to 65535, only used if fixedHostPort==0

Here are the command line arguments that can be added when running a .bat/.sh file:

my_kit_app.bat --/app/livestream/port=XXXXX
my_kit_app.bat --/app/livestream/fixedHostPort=XXXXX
my_kit_app.bat --/app/livestream/minHostPort=XXXXX
my_kit_app.bat --/app/livestream/maxHostPort=XXXXX
./my_kit_app.sh --/app/livestream/port=XXXXX --/app/livestream/fixedHostPort=XXXXX