How to access device via External Public URL, Local Access with Host Network Mode

Product support balenaOS
,
1

I have a Node server, a React client using Nginx to serve the content and a RTSP streaming server. All of these containers are currently running in host network mode. I’m having trouble making requests from the client to the server from the local IP and the public URL.

I can make the local IP work if we change all of the requests in the client to use the device IP but this isn’t desirable.

No matter what I try I can’t make the client access the server from the public URL. I’m pretty sure this has due to with nginx.conf file not being correct. I have looked for answers on this forum but they all see to have the containers running in bridge mode.

Docker-compose.yml

version: "2.0"

services:
  client:
    build: "./client"
    privileged: true
    network_mode: host
    depends_on:
      - server
    volumes:
      - "config:/app/config"
  server:
    build: "./server" # use this directory as the build context for the service
    privileged: true
    network_mode: host
    labels:
      io.balena.features.kernel-modules: "true"
      io.balena.features.firmware: "true"
    environment:
      CAN0_BITRATE: 250000
    volumes:
      - "db:/app/db"
      - "config:/app/config"
      - "videos:/app/videos"
  stream-server:
    build: "./stream-server" # use this directory as the build context for the service
    privileged: true
    network_mode: host
    labels:
      io.balena.features.kernel-modules: "true"
      io.balena.features.firmware: "true"
volumes:
  db:
  config:
  videos:

Nginx.conf

server {
  listen 80;
  
  location / {
    root /usr/share/nginx/html;
    index index.html index.htm;
    try_files $uri $uri/ /index.html =404;
  }
  
  include /etc/nginx/extra-conf.d/*.conf;
}

Thoughts on how I can make this work?

Thanks,

2

Hey @WestCoastDaz,

A couple questions here:

  • What exactly you mean by public URL? Are you referring to the balena device proxy URL enabled in the dashboard?
  • What addresses have you tried in the frontend of the app. I’m only assuming localhost would be one of the first attempts, but that isn’t working? You can try binding to something other than localhost but I don’t think it will change it (0.0.0.0) as an example.
  • Have you checked for any CORS issues on the front end accessing the server? You would be able to see a cross-origin error easily from the browser debugger. You can also allow cross origin headers directly into nginx to see if that helps (sorry if this is the wrong context, I’m not sure exactly how the app is setup). This would be added to the server section:
    add_header Access-Control-Allow-Origin *;
  • How is the RTSP stream being served? Is it also using nginx? What port is it binding to?
3

Hey @nucleardreamer

I have answered your questions below:

  • Yes I mean the balena device proxy URL.
  • We have tried localhost and the device IP shown in the Balena dashboard. The device IP works localhost doesn’t.
  • We have checked CORS and that doesn’t seem to be the issue.
  • Not he RTSP stream is in it’s own container and localhost works for this.

Thanks,

4

Oh Nginx config files, the hours we have all lost in an Nginx config file is hard to fully measure. I feel your pain.

Hate to jump in with a curve ball, and will try and help with the config file if it’s still an issue. But I’m wondering if you have tried Caddy? https://caddyserver.com/

It seems across the forum lots of people start with Nginx. We all tend to because it is a small and lightweight implementation. But it’s designed for huge traffic that would never be reached on an IoT device. I wonder if we are creating more challenges for ourselves. I hope to play around some more with Caddy as an alternative, and hopefully encourage some more people to join me and try it out. It’s a much simpler implementation, has automatic https certificates, and human readable config files. Hopefully can ease some developer woes on Balena too.

5

@maggie0002

Thanks for taking the time to answer. I haven’t tried Caddy but it’s something I will look into. Do you have tips/ticks for getting Caddy working?

I did manage to get help from Balena with the Nginx config which is working well now.

Thanks,

6

@westcoastdaz I have a very basic balena implementation of Caddy here: GitHub - alanb128/landr-buddy: Easily upload a website and test with a public URL. that may be useful as a starting point, along with their documentation.

1 Like
7

@alanb128 thank you I will look into that!

9

Nice. Looks like the caddy file is:

:80 {
         # Set this path to your site's directory.
         root * /usr/share/caddy

         # Enable the static file server.
         file_server
 }

I would certainly take that over an nginx.conf file.

This is something else that might be good to demonstrate the community Balena Device UI on when it is ready too (GitHub - maggie0002/balena-device-ui: A UI for Balena devices.). There is a File Manager component and the UI could be configured just to show that single component. @nucleardreamer