How to use Streamlit with Nginx?

Deployment
31

Hello everyone! I am trying to deploy a streamlit application on Linux (Ubuntu 18.04.4) machine. I am not deploying it via docker, I am just editing Nginx configuration file at /etc/nginx/nginx.conf. Here is a full file:

events {
	worker_connections 768;
	# multi_accept on;
}

http{
    server {
        listen 80;
        listen 443 ssl;

        server_name ar-hand-api-stg.centralus.cloudapp.azure.com;
        index index.php index.html index.htm;

        ssl_certificate /etc/nginx/ssl/domain-crt.crt;
        ssl_certificate_key /etc/nginx/ssl/domain-key.key;

		ssl_protocols       TLSv1.2;

        ssl_session_cache    shared:SSL:10m;
        ssl_session_timeout  10m;

        ssl_ciphers  AES256-SHA;
        ssl_prefer_server_ciphers  on;
		
		client_max_body_size 2G;

        # Streamlit server
        location /dashboard {
            proxy_pass http://localhost:8501/dashboard;
        }
        location ^~ /static {
            proxy_pass http://127.0.0.1:8501/dashboard/static;
        }
        location ^~ /healthz {
            proxy_pass http://127.0.0.1:8501/dashboard/healthz;
        }
        location ^~ /vendor {
            proxy_pass http://127.0.0.1:8501/dashboard/vendor;
        }
        location /dashboard/stream {
            proxy_pass http://localhost:8501/dashboard/stream;
            proxy_http_version 1.1; 
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $host;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_read_timeout 86400;
        }
    }
}

I am running Streamlit via the next command:

streamlit run streamlit_app.py --server.port 8501 --server.baseUrlPath /dashboard/ --server.enableCORS false --server.enableXsrfProtection false --server.headless=true

And then I am trying to connect to my web app via the next link: https://ar-hand-api-stg.centralus.cloudapp.azure.com/dashboard/

This result are next errors in the terminal (I also attach a screenshot):

Unchecked runtime.lastError: The message port closed before a response was received.

ar-hand-api-stg.centralus.cloudapp.azure.com/:1          GET https://ar-hand-api-stg.centralus.cloudapp.azure.com/dashboard/vendor/bokeh/bokeh-2.4.1.min.js net::ERR_INCOMPLETE_CHUNKED_ENCODING 200 (OK)

bokeh-widgets-2.4.1.min.js:38 Uncaught TypeError: bokeh.register_plugin is not a function
    at bokeh-widgets-2.4.1.min.js:38:20
    at bokeh-widgets-2.4.1.min.js:43:1
    at bokeh-widgets-2.4.1.min.js:32:3
    at bokeh-widgets-2.4.1.min.js:33:3

ar-hand-api-stg.centralus.cloudapp.azure.com/:1          GET https://ar-hand-api-stg.centralus.cloudapp.azure.com/dashboard/static/js/5.df97478a.chunk.js net::ERR_INCOMPLETE_CHUNKED_ENCODING 200 (OK)

Screenshot_2
Screenshot_22564×1593 305 KB

Can anyone please help me here? I’ve already tried a dozen of different Nginx and Streamlit configurations, nothing really works. I will really appreciate any help here!

1 Like