Hi there, I am trying to run a dash app instance on pythonanywhere.com with my main flask app.
When I run the sample code from dash tutorial
import dash
import dash_core_components as dcc
import dash_html_components as html
app = dash.Dash()
app.layout = html.Div(children=[
html.H1(children='Hello Dash'),
html.Div(children='''
Dash: A web application framework for Python.
'''),
dcc.Graph(
id='example-graph',
figure={
'data': [
{'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': 'SF'},
{'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': u'MontrĂŠal'},
],
'layout': {
'title': 'Dash Data Visualization'
}
}
)
])
if __name__ == '__main__':
app.run_server(debug=True)
I get an error displayed on my browser 'Error loading layoutâ
WSGI
import sys
project_home = u'**********'
if project_home not in sys.path:
sys.path = [project_home] + sys.path
from werkzeug.wsgi import DispatcherMiddleware
from flask_app import server as app1
from dash_app import app as app2
application = DispatcherMiddleware(app1, {
'/dash': app2.server
})
I havenât been able to find any threads related to this specific error. Any help/comment is welcomed!
Perhaps start by seeing if the problem is associated with a minimal version that just sets application to your Dash app.server.
Another suggestion, try app = dash.Dash(__name__). The name param (which weâre setting to the current module here) will be passed onto the Flask server that is created. Sometimes this doesnât matter, but sometimes this is important for Flask.
After playing around I worked out what the problem is (then discovered someone else already had worked it out too).
The issue is that when you mount the Dash app at /dash, while the dispatcher is aware of this prefix, the Dash app itself is not. In particular the API requests from the client are still being directed to their various endpoints at the root. For example the failed request that leads to the error you see is going to /_dash-layout, when it should be going to /dash/_dash-layout. As suggested in the post I linked to, you can fix this by updating Dashâs request route prefix to make it relative rather than absolute, like this:
app.config.requests_pathname_prefix = ''
This however will break if you provide a custom value of url_base_pathname when creating a Dash instance. I think a more general solution could be this, however I havenât tested it all that thoroughly:
Also, I think the reason that Stackoverflow answer you linked to works, is not because it solves this problem, but because it just works around it by having the Dash appâs Flask instance be mounted at the root and therefore does not have to worry about the discrepancy between prefixes. The approach Iâve suggested, is more general, allowing you to mount the Dash instance wherever you want.
Iâve created a gh repo for anyone interested in seeing an example of such a setup: mbkupfer/dash-with-flask
I threw this together over the weekend and I do plan to refine the example a bit more once I get the time. That said, I thought I would put this out now in case someone needed it before now and then.
Big shout out to ned. You are a Dash genius! @nedned
I notice that in this code that you have provided I do not see a line that instantiates your layout.
Iâm expecting something that goes like this: app.layout = (your layout here)
Try transferring your get_layout(app) function into the file that creates your dash app instead of importing it from DashboardLayout. Try this deploying in AWS again and please report back if it works. Also, I sincerely apologize, I was genuinely unaware that you had promptly responded to me. I know itâs very late but hereâs my suggestion.