title: Integrate Dash into Flask
body: <p>I am trying to integrate a Dash app into an existing Flask program with Flask-Login. If I add <code>server=server</code> to the Dash instance every route (even ones that don't exist!!!), except the specified routes in run (ie. /home, /login), take me to the Dash app.</p>
  
  <p>Example:</p>
  
  <p>localhost:500/ - Takes me to Dash app</p>
  
  <p>localhost:5000/home - Takes me to home route</p>
  
  <p>localhost:5000/da - Takes me to Dash App</p>
  
  <p>If I remove the <code>server=server</code> from the Dash instance, all the path's work as I would like, but when I pull up the dashboard at localhost:5000/test I get the error 'Error Loading Layout'.</p>
  
  <p>If I add a <code>url_base_pathname='/base/'</code> to the dash instance, the routes work, but the dashboard bypasses my login.</p>
  
  <p>Code Files:</p>
  
  <p><strong>server.py:</strong></p>
  
  <pre><code>from flask import Flask
  
  server = Flask(__name__,instance_relative_config=False)
  
  server.config['SECRET_KEY'] = 'secretkey'
  </code></pre>
  
  <p><strong>run.py:</strong></p>
  
  <pre><code>from flask import Flask, render_template, request, redirect
  from flask_sqlalchemy import SQLAlchemy
  from flask_login import LoginManager, UserMixin, login_user, login_required, logout_user
  from server import server
  from dashboard import app as app_1
  from werkzeug.middleware.dispatcher import DispatcherMiddleware
  from werkzeug.serving import run_simple
  
  server.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///login.db'
  
  db = SQLAlchemy(server)
  login_manager = LoginManager()
  login_manager.init_app(server)
  
  class User(UserMixin,db.Model):
      id = db.Column(db.Integer, primary_key=True)
      username = db.Column(db.String(30), unique=True)
      password = db.Column(db.String(30))
  
  @login_manager.user_loader
  def load_user(user_id):
      return User.query.get(int(user_id))
  
  @server.route('/login')
  def login():
      return render_template('login.html')
  
  @server.route('/homepage', methods=['POST'])
  def homepage():
      username = request.form['username']
      password = request.form['password']
  
      user = User.query.filter_by(username=username,password=password).first()
  
      if not user:
          return 'User not Found'
  
      else:
          login_user(user)
          return render_template('homepage.html')
  
  @server.route('/logout')
  def logout():
      logout_user()
      return index()
  
  
  @server.route('/')
  @server.route('/home')
  def index():
      return render_template('index.html')
  
  @server.route('/test')
  @login_required
  def dashboard():    
      return redirect('/dash1')
  
  
  app = DispatcherMiddleware(server, {
      '/dash1': app_1.server})
  
  if __name__ == '__main__':
      run_simple('0.0.0.0', 5000, app, use_reloader=True, use_debugger=True)
  </code></pre>
  
  <p><strong>dashboard.py</strong></p>
  
  <pre><code>import dash
  import dash_html_components as html
  from server import server
  
  app = dash.Dash(__name__)
  
  app.layout = html.Div('Dashboard Page')
  </code></pre>
  
  <p>I would appreciate any insight on this.  I've been scouring the internet for the past 2 days and can't solve this.  Ultimately, the best solution would be if I can figure out why there is a layout error when <code>server=server</code> is removed because the entire app functions other than that.</p>
  
  <p>Thanks</p>