I would like to embed a Dash app inside a Flask webapp that is based on the flask templating.
I saw that some suggested using iframe, but how this can be done actually?
Aren’t there any better solutions to do this?
2 Likes
To embed a Dash app as an iframe, run the dash app in a separate python process and then use the iframe markup to embed it by URL:
<iframe src="the-url-of-your-dash-app" style="border: none;"/>
There are not any better solutions to this right now, however there will be in the future. If anyone reading this would like to sponsor the development of a better solution, please reach out: Consulting, Training & Open-Source Development
2 Likes
I figure out a way to handle Dash apps and Flask templates, you can see my code 
https://github.com/jimmybow/Dash_app_with_Flask_template/tree/master
2 Likes
good job man~~
I have another question ,can u help me?
above u settled a problem with adding dash to flask project.
what i want to do is adding flask into dash app .
the problem coming from here : I draw a map in flask , but i want it to display in a dash app as one of its components.
2 Likes
Maybe you can iframe your map to dash app… 
but you can’t transform it as a dash component unless you make it be a react.js component.
I worked this out by renderring the map as a local html file and reading the string into an iframe object. Thanks.
邮箱：tasselmi@yeah.net
签名由 网易邮箱大师 定制
1 Like
HI, can you do me a favor ? SOS ！
I want to use a flask app as one part of a dash app webpage , but I don’t know how to do it .
I konw one method is to render the map as a local html file and them read the html file into a dash iframe object.
But I’M curious about if a dash app can comunicate with a flask app.
Do you kown how?
dash app and jinja2 can’t comunicate directly because they are different render way.
Currently, the only way i known to comunicate with a flask app is use url argument … ,or you need to use dash directly … with the map wrap in a react.js
CAN YOU show me how to use url argument?
use ‘search’ prop. of dcc.Location in dash app.
app.layout = html.Div([
dcc.Location(id='url', refresh=False),
html.Div(id='index')
])
@app.callback(
Output('index', 'children'),
[Input('url', 'search')])
def display_page(request_args):
if request_args:
rr = pd.Series(str(request_args)[1:].split('&')).str.split('=')
key = rr.str.get(0)
value = rr.str.slice(1,).str.join('=')
if 'secret' in list(key) and value[key == 'secret'].iloc[0] == create_secret(str(datetime.now()).split(':')[0]):
return html.Div([
html.Div(id='target'),
dcc.Input(id='input', type='text', value='')
])
return html.Div('Error !')
1 Like
I figure out a way to handle Dash apps and Flask templates, you can see my code
https://github.com/jimmybow/Dash_app_with_Flask_template/tree/master
@jimmybow this is great! I’m using this to make Dash work with the flask-login user functionality - users won’t be able to get to the dash app with a URL; they must be logged in. Thank you.
Great, I also imporve the code recently, 
1 Like
Hi just got to your example I’m having an OS error which seems to be a problem using 64/32 bit version of a program, can you tell me your config where you developed this? OS, python ver fo instance?
the error message is: (when I run python run.py)
OSError: [Errno 8] Exec format error:
Best.
got it fixed, for some reason had to set
if name == “main”:
app.run(debug = False)
in app.py, i wol have a closer look at this.
Best.
I found this while searching for similar problem. turning off debug mode fixed my problem.
OS = ubuntu app in windows 10
python 3.7.3
pip install dash==1.6.1
pip install dash-daq==0.3.1
print("name = ", name)
if name == ‘main’:
print(“start server”)
#app.run_server(debug=True) # this causes errors - OSError: [Errno 8] Exec format error:
app.run_server(debug=False)
Appears related to this git issue below.
https://flask.palletsprojects.com/en/1.0.x/cli/
I know this post is from a long time ago but thank you Jimmy! Your project has allowed me to insert dash apps below a common navigation bar for the outer flask app container!
wonderful.
I have another question ,can you help me?
Currently I have to read data from my database to draw the chart.
I want some way to connect my database directly. When the database changes, the chart also updates
Thank you