Nginx Proxy Fails for iframe in BlueOS Extension

Blue Robotics Software BlueOS
1

Hello everyone! :smiley:

I’m updating the ROS2 extension for BlueOS to improve its terminal functionality, and have run into a proxy issue with Nginx

Goal

The original extension (based on @patrickelectric ‘s OG ROS extension) uses ttyd/tmux, but its copy/paste is unreliable. The new version aims to fix this by serving a web-based terminal inside an HTML <iframe>.

The Problem

The new setup works perfectly under two conditions:

  1. On my local development machine (Windows/Docker).

  2. On BlueOS, when I access it directly via its IP address and port (e.g., http://192.168.1.248:``4717).

ip_url
ip_url2880×1920 123 KB

However, it fails to load when accessed through the proxied URL that BlueOS provides for the extension (e.g., http://blueos-wifi.local/extension/ros2?full_page=true).

extension_url
extension_url2880×1824 104 KB

This leads me to believe the issue is with the Nginx configuration

Here’s a link to the nginx config file: https://github.com/itskalvik/blueos-ros2/blob/dev/files/nginx.conf

I would appreciate any help with this issue ^-^

1 Like
2

Ok, figured it out! :smiley:

Here’s the config that worked, also it helps to clear the cache before testing

worker_processes auto;
pid /var/run/nginx.pid;

events {
    worker_connections 1024;
}

http {
    server {
        listen 0.0.0.0:4717;
        # This will make Nginx listen for any hostname.
        server_name _;

        # This location serves your main webpage (index.html).
        location / {
            root /usr/share/ttyd;
            index index.html;
            try_files $uri $uri/ /index.html;
        }

        # This single location now correctly proxies all /ttyd/ traffic.
        # It handles both the initial HTTP request and the WebSocket connection.
        location /ttyd/ {
            # Forward the request to the ttyd service running on port 4718.
            # Using 127.0.0.1 (localhost) is more explicit and secure.
            proxy_pass http://0.0.0.0:4718/;

            # These headers are essential for WebSocket proxying to work.
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "Upgrade";

            # Override X-Frame-Options
            proxy_hide_header X-Frame-Options;
            add_header X-Frame-Options "ALLOWALL" always;
        }

        # This location is for the BlueOS service registration.
        location /register_service {
            alias /site/register_service;
        }
    }
}
4 Likes