Flask's DispatcherMiddleware not playing nice with Plotly's Dash

Dash Python
1

(Hi! This question is a copy of this SO question – consider posting the answer there and noting here if you’ve done so).

I have an existing Flask web app, and I want to incorporate an existing Dash app (a Plotly Flask app) into it. As Flask’s documentation recommends, I am using DispatcherMiddleware thusly to make this happen:

flask_app = Flask(__name__) # App with both apps attached to it 
app = Flask(__name__) # Existing Flask App 
dash_app = Dash(__name__) # Dash app 

dash_app.config.supress_callback_exceptions = True

# Use DispatcherMiddleware to route separate apps into one
flask_app.wsgi_app = DispatcherMiddleware(app, {'/dash': dash_app.server})

We end up running flask_app:

if __name__ == "__main__":
    flask_app.run(debug=True)

However, when I head to 127.0.0.1:<port>/dash/, I get the following error to appear on the webpage:

enter image description here

I see the following in the console log:

127.0.0.1 - - [30/Aug/2017 11:11:02] "GET /dash HTTP/1.1" 301 -
127.0.0.1 - - [30/Aug/2017 11:11:02] "GET /dash/ HTTP/1.1" 200 -
127.0.0.1 - - [30/Aug/2017 11:11:03] "GET /_dash-layout HTTP/1.1" 404 -
127.0.0.1 - - [30/Aug/2017 11:11:03] "GET /_dash-dependencies HTTP/1.1" 404

How can I get the layouts to load properly for my Dash app?

2

As @lukesingham mentioned at Hosting multiple Dash apps with uWSGI + Nginx,

I had the same experience. And the code below right after your dash_app solved the problem. Maybe you should try.

# In order to work on shinyproxy (and perhaps other middleware)
app_dash.config.supress_callback_exceptions = True
app_dash.config.update({
    # remove the default of '/'
    'routes_pathname_prefix': '',

    # remove the default of '/'
    'requests_pathname_prefix': ''
})