Hi! I would appreciate any thoughts regarding the following issue.
The issue is related to streamlit
component. It never happens while running an app on localhost. It happens sometimes while running an app on EC2 instance. This happens not only when the grid big. It is happening with small grids also. I am not able to figure out steps to reproduce the issue. It happens randomly.
I am not able to understand the second item from the screenshot. I mean the point related to complied frontend. I installed streamlit - aggrid component using pip. I am able to see that ag-grid component has static files.
Does it mean that I have the compiled frontend or not? This is my first question.
I would appreciate any ideas regarding addressing the issue in general. I am able to see that it is hard for @ PablocFonseca to come up with any solution so far. The issue was discussed here and here
Hey! Ag-grid component has static files and is compiled. My guess is that this issue is happening at the streamlit side of the component. I’m having trouble to debug this, because I cannot reproduce the issue. Maybe you can share a link where the bug happens often?
The issue may be this line in streamlit/frontend/src/components/widgets/CustomComponent/ComponentInstance.tsx :
52: port const COMPONENT_READY_WARNING_TIME_MS = 3000
Since the timeout is just 3000 ms, component may be timing out due to this hardcoded configuration.
I think manually changing the file in your deploy environment to raise the COMPONENT_READY_WARNING_TIME_MS const won’t work because the tsx file needs to be recomplied. Maybe some streamlit dev that commited this file (@kantuni, @tim , @AustinC) may help us.
I suggest opening a ticket on streamlit tracker
Yeah, this is a somewhat arbitrarily-chosen timeout. It measures the amount of time between a Component’s iframe being mounted and the component sending its “hello I’m ready to receive data” message back to Streamlit.
We show this error message if that timeout is exceeded. The error message will disappear if the component eventually does finish loading. It sounds like the message never goes away for you, which may mean the component is throwing an error that’s preventing it from loading. If you look at the error console in your browser’s developer window, do you see any errors?
In the component. Does this happen when the line
export default withStreamlitConnection(AgGrid)
is executed on my custom.tsx?
export default withStreamlitConnection(AgGrid) constructs a wrapper class that manages the Streamlit connection for your component. The creation of the wrapper class doesn’t actually do any Streamlit handshaking - the handshaking occurs when the wrapped component is mounted.
(In other words, this particular line is unlikely to be the source of an errors - but if the wrapped component has on error in its mounting or rendering logic, then that error could be causing this issue?)
Having a reproducible case would help us get to the bottom of the issue - @p0povaalesi, is there a link you can share with us?
Thank you for the comments. I am sending you a video to showcase the issue in action.
I am sending you streamlit app that I used while recording the video.
I am sending you [Test File] (test - Google Drive) that I used while recording the video.
I was not able to notice nothing special in chrome console. I believe that the issue is related somehow to the quality of internet connection. I was using weak internet connection while recording the video.
It looks like you will not be able to catch the issue while using fast internet connection with good ping. I am not able to catch it all the time even while using weak internet connection.
Please let me know if I need to do anything else.
I am having the same issue with the ‘trouble loading st_aggrid component’, and I get the following error in the console:
Refused to display ‘<MY_URL>/component/st_aggrid.agGrid/index.html?streamlitUrl=<MY_URL>’ in a frame because it set ‘X-Frame-Options’ to ‘deny’
Any idea how to resolve this @tim or @PablocFonseca ?
Thanks for the PR @kev_r! This is now merged into develop.
Any idea in which version I can find this fix?
Hey @erezrot - the fix is in 0.83.0, the latest version. (Normally, this release would’ve come a bit faster after 0.82, but we had some big under-the-hood stuff happening that delayed it a bit.)
We had the same issue/error (it was actually when we tried to deploy an app in Kubernetes).
After weeks of troubleshooting - we eventually solved it by adding the following response headers to nginx:
Seems like by default this is set to
deny in Ingress controller.
So if used in K8s - the following annotation needs to be added to the Ingress:
more_set_headers "X-Frame-Options: SAMEORIGIN";
Hi Adam, thank you for your feedback; could you please illustrate in detail how to effectively change those configuration settings?
@tim, Am using streamlit-aggrid==0.2.3.post2 version and am facing this issue still. Which version should I use as I don’t see 0.83.0 version for streamlit-aggrid?
@Adam_12 cAN you please illustrate in detail how to effectively change those configuration settings?
@Adam_12 would be super helpful, as we’re still running into this problem as well, including after the k8s reverse proxy reconfig.
I used to have the very same problem with the
streamlit-option-menu component :
Nothing helped of what has been shared here in this thread or anywhere else.
What did work for me was to execute
import streamlit_option_menu very early during the Streamlit app loading process. I expected this to allow for successfully registering the component with Streamlit before it gets too busy
I already had a python script launching my Streamlit application (because of using
python-dotenv) so I added to that a simple mechanism to import
streamlit-option-menu early enough.
After removing the
dotenv specific stuff, here is what remains:
from streamlit.config import on_config_parsed
from streamlit.web.cli import main
Then starting my app with
python3 run.py … and Viola! - I haven’t seen the dreaded “Your app is having trouble…” anymore
Hope this helps someone.
(Streamlit 1.12.2, streamlit-option-menu 0.3.2.)
@bpiv400, @Nom_ji, does this approach help in your cases?
We have deployed app in Kubernetes getting same issue. did we get the root cause of this issue or any fixes(Nothing worked for me in given suggestions)
I’m experiencing the same issue after the deployment and none of the suggested workarounds helps me.