Deployed app through reverse proxy only shows blank page and Streamlit title

Deployment
1

Dear all, I am trying to deploy streamlit on a ubuntu server then using nginx to connnect to a domain name. I have set the nginx config file to redirect localhost:8502 to my url. But going to the url will only display a blank page.

streamlit_blankpage
streamlit_blankpage1818×1080 13.5 KB

  • Nginx reverse proxy is working fine, if I set up a http server through port 8502, visiting the url will show the directory of the server.
  • The streamlit app can be successfully visited through public_IP_address_of_server:8502.
  • When streamlit app is running at port 8502 and nginx is proxying my_url to localhost:8502, cURL my_url returns StatusCode 200, StatusDescription OK.
  • Clearing cache from browser or changing browers does not solve the issue.

Nginx config file:

server {
    listen 443 ssl; 
    listen [::]:443 ssl;
    server_name my_domain_name;
    ssl_certificate     /home/some_dir/some_file.crt;
    ssl_certificate_key /home/some_dir/some_file.key; 
    ssl_session_timeout 5m;
    ssl_protocols       TLSv1.2 TLSv1.3; # comment it, if you don't have ssl
    ssl_ciphers         ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4; # comment it, if you don't have ssl
    client_max_body_size 100M; 
    ssl_prefer_server_ciphers on;

    location / {
      include /etc/nginx/proxy_params;
      proxy_pass http://localhost:8502/;
      proxy_redirect off;
      proxy_http_version 1.1;
    }
  }
server {
    listen 80;
    server_name my_domain_name
    return 301 https:$host$request_uri;
}

Streamlit config file:

[server]
port=8502 # change port number. By default streamlit uses 8501 port
headless=true # This will eliminate automatically open browser
#enableCORS=false 
#enableXsrfProtection=false 
#enableWebsocketCompression=false
#[browser] # This ip and port will show in command prompt
#serverAddress = "public_IP_address_of_server" # Put your Local IP or Domain Name
#serverPort = 8502

cURL results:

StatusCode        : 200
StatusDescription : OK
Content           : <!doctype html><html lang="en"><head><meta charset="UTF-8"/><meta name="viewport" content="width=de
                    vice-width,initial-scale=1,shrink-to-fit=no"/><link rel="shortcut icon" href="./favicon.png"/><link
                     r...
RawContent        : HTTP/1.1 200 OK
                    Connection: keep-alive
                    Vary: Accept-Encoding
                    Accept-Ranges: bytes
                    Content-Length: 892
                    Cache-Control: no-cache
                    Content-Type: text/html
                    Date: Mon, 25 Dec 2023 08:05:32 GMT
                    ETag: ...
Forms             : {}
Headers           : {[Connection, keep-alive], [Vary, Accept-Encoding], [Accept-Ranges, bytes], [Content-Length, 892]..
                    .}
Images            : {}
InputFields       : {}
Links             : {}
ParsedHtml        : mshtml.HTMLDocumentClass
RawContentLength  : 892

Any ideas?

2

Solved. Needed websocket part in Nginx config file.

# Also requires websocket:
	proxy_set_header Upgrade $http_upgrade;
	proxy_set_header Connection "upgrade";
3

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.