How to combine one or more Dash apps with existing WSGI apps?

Without wasting anyone’s time let's directly jump into the solution.

When we see any kind of examples we understand more easily rather than reading the big paragraph. Here, I will explain the integration using an example.

The following example illustrates this approach by combining two Dash apps with a Flask app.

flask_app.py

from flask import Flask

flask_app = Flask(__name__)

@flask_app.route('/')
def index():
    return 'Hello Flask app'

and let's set up two dash application

app1.py

import dash
import dash_html_components as HTML

app = dash.Dash(
    __name__,
    requests_pathname_prefix='/app1/'
)

app.layout = html.Div("Dash app 1")  

app2.py

import dash
import dash_html_components as HTML

app = dash.Dash(
    __name__,
    requests_pathname_prefix='/app2/'
)

app.layout = html.Div("Dash app 2") 

wsgi.py

from werkzeug.wsgi import DispatcherMiddleware

from app1 import app as app1
from app2 import app as app2

application = DispatcherMiddleware(flask_app, {
    '/app1': app1.server,
    '/app2': app2.server,
})  

In this example, the Flask app has been mounted at / and the two Dash apps have been mounted at /app1 and /app2. In this approach, we do not pass in a Flask server to the Dash apps, but let them create their own, which the DispatcherMiddleware routes request to based on the prefix of the incoming requests. Within each Dash app, requests_pathname_prefix must be specified as the app's mount point, in order to match the route prefix set by the DispatcherMiddleware.

Note that the application object in wsgi.py is of type werkzeug.wsgi.DispatcherMiddleware, which does not have a run method. This can be run as a WSGI app like so:

$ gunicorn wsgi:application 

Alternatively, you can use the Werkzeug development server (which is not suitable for production) to run the app:

run.py

from werkzeug.wsgi import DispatcherMiddleware
from werkzeug.serving import run_simple

from app1 import app as app1
from app2 import app as app2

application = DispatcherMiddleware(flask_app, {
    '/app1': app1.server,
    '/app2': app2.server,
})

if __name__ == '__main__':
    run_simple('localhost', 8050, application) 

If you need access to the Dash development tools when using this approach (whether running with a WSGI server or using the Werkzeug development server) you must invoke them manually for each Dash app. The following lines can be added before the initialization of the DispatcherMiddleware to do this:

app1.enable_dev_tools(debug=True)
app2.enable_dev_tools(debug=True)  

Note: debug mode should not be enabled in production. When using debug mode with Gunicorn, the --reload command line flag is required for hot reloading to work.

In this example, the existing app is combined with two Dash apps in a Flask app, however, this approach enables the combination of any web application implementing the WSGI specification. A list of WSGI web frameworks can be found in the WSGI documentation with one or more Dash apps.

Reference - https://dash.plot.ly/integrating-dash

Published At :01-May-20213 mins read

Author

Technology