Any ideas on "Your app is having trouble loading the st_aggrid.agGrid component"?

Hi, are there any updates on this?

I’m also running into the same issue after I build my component (with the dev server locally it works fine). None of the solutions above worked for me…

Using streamlit==1.15.1, repo here.

2 Likes

After some help, I was able to resolve my issue. I was using a different Streamlit template (that uses React hooks by @whitphx ), and in the package.json I accidentally deleted the "homepage": "."

After including it back, I was able to get it working! :tada:

2 Likes

thanks, @murilo-cunha for pointing out I was converting react app to a component and miss this.

This seems to have done it for me. I import streamlit-options-menu, streamlit-aggrid and extra-streamlit-components (for the cookie manager) all in one function, as you do here.

"""This module solves a deployment bug in Streamlit -
https://discuss.streamlit.io/t/any-ideas-on-your-app-is-having-trouble-loading-the-
st-aggrid-aggrid-component/10176/19?u=vovavili"""

import sys
from pathlib import Path

from streamlit.config import on_config_parsed
from streamlit.web import cli


# noinspection PyUnresolvedReferences
def heavy_imports() -> None:
    """For an explanation, please refer to this thread -
    https://discuss.streamlit.io/t/any-ideas-on-your-app-is-having-trouble-loading-the-
    st-aggrid-aggrid-component/10176/19?u=vovavili"""
    import extra_streamlit_components as stx
    import streamlit_option_menu
    from st_aggrid import AgGrid, ColumnsAutoSizeMode, GridOptionsBuilder, JsCode


def main() -> None:
    on_config_parsed(heavy_imports)
    sys.argv.extend(
        [
            "run",
            str(Path(__file__).resolve().parent / "app.py"),
            "--server.port=8080",
            "--server.address=0.0.0.0",
        ]
    )
    cli.main(prog_name="streamlit")


if __name__ == "__main__":
    main()

3 Likes

I’m getting this when deploying on k8s with nginx ingress. None of the workarounds have helped :frowning:

1 Like

@ya55en do you also import the packages again in your homepage.py file? I tried this but i was getting an error that the packages are not importing

1 Like

@shivpalit-das42: Sure, you have to import everything in your homepage.py that the code references, including streamlit_option_menu; I have this import statement there (among many others):

# in homepage.py
from streamlit_option_menu import option_menu

HTH :wave:

2 Likes

@VovaVili I am getting the same yellow box with the error “trouble loading extra_streamlit_components.CookieManager” but we do not call cookie manager explicitly - we are using it as part of the authenticator though I guess. How are you using it in your app.py file?

1 Like

Thank you very much! This really works for me!!

1 Like

Hi, I’m facing similar issues with k8s/nginx, specifically after the pods horizontally autoscale. Did you manage to find any workarounds?

1 Like

I have my streamlit app behind a reverse proxy with nginx. I needed to use these settings in order to map all the internal requests to the streamlit backend.

server {
        listen 80 default_server;
        listen [::]:80 default_server;
        server_name localhost;
        location / {
                proxy_pass http://127.0.0.1:8501;
        }
        # streamlit redirects config
        location /streamlit-components-demo {
                proxy_pass http://127.0.0.1:8501/;
        }
        location ^~ /static {
                proxy_pass http://127.0.0.1:8501/static/;
        }
        location ^~ /healthz {
                proxy_pass http://127.0.0.1:8501/healthz;
        }
        location ^~ /vendor {
                proxy_pass http://127.0.0.1:8501/vendor;
        }
        location ^~ /component {
                proxy_pass http://127.0.0.1:8501/component;
        }

        location /stream {
                proxy_pass http://127.0.0.1:8501/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;
        }
}

Hope this helps

1 Like

hi, i am facing the same problem with nginx, did someone solve this ?

1 Like

i’m facing the same problem when i use nginx to forward http url,it works normally if i set just one server in upstream

Your app is having trouble loading the streamlit_webrtc.component.webrtc_streamer component.

(The app is attempting to load the component from ****, and hasn't received its "streamlit
" message.)

If this is a development build, have you started the dev server?
If this is a release build, have you compiled the frontend?
For more troubleshooting help, please see the Streamlit Component docs or visit our forums.

heres nginx conf

upstream ovkws_server{
    server 10.30.4.53:8501;
    server 10.30.4.53:8502;
    server 10.30.4.53:8503;
}


server {
    listen    8080;
    server_name  10.30.4.53;

    location / {
        proxy_pass http://ovkws_server;
        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 $connection_upgrade;
        proxy_read_timeout 86400;
    }

    location /streamlit-components-demo {
        proxy_pass http://ovkws_server;
    }
    location ^~ /static {
        proxy_pass http://ovkws_server/static/;
    }
    location ^~ /healthz {
        proxy_pass http://ovkws_server/healthz;
    }
    location ^~ /vendor {
        proxy_pass http://ovkws_server/vendor;
    }
    location ^~ /component {
        proxy_pass http://ovkws_server/component;
    }
}
1 Like

Streamlit version 1.32.0 is now available and includes a significant improvement for custom components. The timeout warning for custom components was replaced with an element skeleton to improve the UX for slow-loading components, especially in some cloud-hosted platforms.

1 Like

Hi Team, I’m facing the same. Trying to apply the solution as proposed with heavy imports. It works in local but when I run it in EKS pods, it throws no module found : streamlit