Question

making streamlit work on https

I have searched for a solution, but still having some issue. my streamlit app runs when accessed from the droplet ip, I have set up a domain name, and my streamlit ui shows correctly when accessing from the https domain-name, however, the chatbox for my app just says “please wait”. mostly I have been looking at setting the port differently, and lots of other options. but if someone has the answer that would be nice


Submit an answer


This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

Sign In or Sign Up to Answer

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

Accepted Answer
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";

the solution was adding this to my nginx file, as it was a websocket issue

KFSys
Site Moderator
Site Moderator badge
July 11, 2023

Heya,

I know the question has been updating with the solution in this case, however there are some general tips to follow when you are presented with such an issue.

If the Streamlit app works correctly when accessed via the IP address but not when accessed via your HTTPS-enabled domain name, the issue might be with your Nginx configuration or your Streamlit app’s settings.

Here are a few steps you can take to troubleshoot this issue:

  1. Check your Nginx Configuration: Make sure you’ve properly set up a server block for your domain, and that you’re proxying requests to your Streamlit app correctly. The location block in your Nginx configuration should look something like this:
location / {
    proxy_pass http://localhost:8501; # Replace with your Streamlit app's port if it's not 8501
    proxy_redirect off;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
  1. Enable HTTPS in Streamlit: While Nginx can handle the HTTPS part, you might need to configure Streamlit to be aware that it’s being served over HTTPS. Check the Streamlit configuration options to see if there’s an option to enable HTTPS or to set the base URL for the app.

  2. Check your app’s JavaScript Console for Errors: Open your web browser’s developer tools (usually F12 key) and check the JavaScript console for any errors when you load the app. This can often provide clues about what’s going wrong.

  3. Ensure WebSocket Support: Streamlit uses WebSockets for communication between the browser and the server. You need to ensure that your Nginx server is set up to correctly proxy WebSocket connections. This is typically handled by including the following lines in your Nginx configuration:

proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";

Try DigitalOcean for free

Click below to sign up and get $200 of credit to try our products over 60 days!

Sign up

Get our biweekly newsletter

Sign up for Infrastructure as a Newsletter.

Hollie's Hub for Good

Working on improving health and education, reducing inequality, and spurring economic growth? We'd like to help.

Become a contributor

Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.

Welcome to the developer cloud

DigitalOcean makes it simple to launch in the cloud and scale up as you grow — whether you're running one virtual machine or ten thousand.

Learn more
DigitalOcean Cloud Control Panel