RaspberryPi4 deployed app loading stuck with Nginx Proxy Manager & Docker

Deployment
,
1

Hi, I’m trying to deploy my streamlit app via Docker on my Raspberry pi 4 with my personal router. The OS on the rpi is Ubuntu server 20.04 LTS.

Everything is containerized with Docker and are working well. I use Nginx Proxy Manager as a secure reverse proxy to share the app on internet at https://streamlit.chainyo.tech , but I can’t make the app loading.

The app is running well locally on <raspberry pi IP adress>:8501 but not loading on the remote link.

  • Streamlit Dockerfile:
FROM python:3.9.6

COPY requirements.txt .

RUN pip install --upgrade --no-cache-dir -r requirements.txt

COPY . /app

WORKDIR /app

CMD ["bash", "-c", "streamlit run streamlit_app.py"]
  • Streamlit docker-compose file:
version: "3.8"

services:
  dashboard:
    image: dashboard:0.1
    build:
      context: ./dashboard
      dockerfile: Dockerfile
    restart: unless-stopped
    container_name: dashboard
    environment: 
      - DB_HOST=${DB_HOST}
      - DB_NAME=${DB_NAME}
      - POSTGRES_USER=${POSTGRES_USER}
      - POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
    ports:
      - "8501:8501"
    # Dev env binding
    volumes:
      - type: bind
        source: ./dashboard
        target: /app
        
# Others are pgadmin and postgressql
  • Streamlit config.toml
[server]
headless=true
port=8501
enableCORS=false
enableXsrfProtection=false
enableWebsocketCompression=false
[browser]
serverAddress="192.168.1.40"
serverPort=8501
[theme]
primaryColor="#d33682"
backgroundColor="#002b36"
secondaryBackgroundColor="#586e75"
textColor="#fafafa"
font="sans serif"

Here is the screenshot from the stuck app:

streamlit_app_stuck

Here is the screenshot of the Network tab in Dev console showing stream pending requests:

streamlit_app_network_tab

I tried all things advised in the streamlit docs without success

enableCORS=false 
enableXsrfProtection=false
enableWebsocketCompression=false

Finally here is the nginx config file, maybe the problem is coming from this file, but I’m not getting it:
192.168.1.40 is the internal raspberry pi IP adress and 8501 the streamlit app port.

# ------------------------------------------------------------
# streamlit.chainyo.tech
# ------------------------------------------------------------


server {
  set $forward_scheme http;
  set $server         "192.168.1.40";
  set $port           8501;

  listen 80;
listen [::]:80;

listen 443 ssl http2;
listen [::]:443;


  server_name streamlit.chainyo.tech;


  # Let's Encrypt SSL
  include conf.d/include/letsencrypt-acme-challenge.conf;
  include conf.d/include/ssl-ciphers.conf;
  ssl_certificate /etc/letsencrypt/live/npm-2/fullchain.pem;
  ssl_certificate_key /etc/letsencrypt/live/npm-2/privkey.pem;

  # Block Exploits
  include conf.d/include/block-exploits.conf;

    # Force SSL
    include conf.d/include/force-ssl.conf;

  access_log /data/logs/proxy-host-2_access.log proxy;
  error_log /data/logs/proxy-host-2_error.log warn;

  location / {
      proxy_pass http://192.168.1.40:8501/;
  }
  location /stream {
      proxy_pass http://192.168.1.40:8501/stream;
      proxy_http_version 1.1;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $host;
  }
}

If someone has the solution, that would be awesome! :slight_smile:

P.S.: Obviously ports 80 and 443 are forwarded on my router.

2

I had to update the conf files used by Nginx Proxy Manager to make it work !

(If I have time I will write a post on how I managed to get my streamlit dashboard app online self-hosted on my raspberry pi with docker and docker-compose files :grinning:)

3 Likes
3

Hi there, I’m having the exact same problem. How did you solve it?

4

You have to add the location /stream part to the conf file, by default the nginx proxy manager will recreate one without this part.

So, you need to ssh to the server it’s deployed and go to /proxy_manager/data/nginx/proxy_host/ and find the right *.conf file created for your service. Then vim or nano inside the file and copy paste the location stream part to it.

Finally you probably will have to restart the proxy, and watch out if the nginx proxy doesn’t recreate one file for the streamlit service. If so rename both files.