Error on local Streamlit page embedding another external Streamlit Cloud page (Streamlit Share)

Community Cloud
,
1

Hi everyone, I’ve discovered something interesting while trying to embed an external Streamlit page inside a local Streamlit page. Apparently, if the page I embed is a local Streamlit page, there’s no problem. But if it’s something I’ve uploaded to Streamlit Share cloud, it won’t let me embed it. I’ll show the code and the difference between both (url doesnt work, but url_local does):

import streamlit as st
import streamlit.components.v1 as components

#example of streamlit share public page
url = 'https://nl2sql.streamlit.app/'
#a local but different streamlit page
url_local = 'http://192.168.1.150:8501/

#using iframe markdown
st.markdown(f'<iframe src={url} width="100%" height="600" style="position:absolute; top:200px; left:0; overflow:hidden; margin-top:-300px;"></iframe>', unsafe_allow_html=True)
st.markdown(f'<iframe src={url_local} width="100%" height="600" style="position:absolute; top:200px; left:0; overflow:hidden; margin-top:-300px;"></iframe>', unsafe_allow_html=True)

#using components
st.components.v1.iframe(url, width=None, height=600)
st.components.v1.iframe(url_local, width=None, height=600)

No matter what streamlit website I embed or what browser I use: If it’s a local streamlit page it will work just fine, but it it’s an external streamlit, mine or not, it just don’t work, even if it’s excactly the same code.

ok

Of course, if you visit the website using the real URL and not embed, it also works.

Any Ideas?

2

Hey @mabusdogma

Are you running the code for the app that’s doing the embedding locally or via Streamlit Community Cloud?

3

I’m running the code locally, on it I’m embedding an external website hosted on the streamlit.app Community Cloud.
The code of the external website is also mine, but I have to share the local app with another users, and some parts of the code are restricted, so one idea I have is to make a ‘Frankenstein’ with local and external (embedded) parts.

4

When embedding a Streamlit Cloud app somewhere (anywhere), make sure to use the correct query parameter in the url: e.g. `url = ‘https://nl2sql.streamlit.app/?embed=true’

5

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