# Dash multipage app with flask login

**URL:** <https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768>\
**Category:** Dash Python\
**Created:** [May 5, 2022, 5:37pm UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768 "2022-05-05T17:37:10Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![sanae](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/sanae/32/22339_2.png) [@sanae](https://community.plotly.com/u/sanae)\
**Post date:** [May 5, 2022, 5:37pm UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/1 "2022-05-05T17:37:10Z")

</div>

This is My dash multi pages structure :

![flask](https://us1.discourse-cdn.com/flex024/uploads/plot/original/3X/6/5/651c21ce0b620d6cb142d09adef3f7905bea8ff0.png)

**app.py** :  
app = dash.Dash( **name** , suppress\_callback\_exceptions=True,  
# use bootsrap

```
             external_stylesheets=[dbc.themes.LITERA , FONT_AWESOME],# different this change your code
            # for mobile
            meta_tags=[{'name': 'viewport',
                        'content': 'width=device-width, initial-scale=1.0'}]
            )

```

**index.py**

```auto

sidebar = html.Div(
    [
        html.Div(Lottie(options=options, width="67%", height="67%", url=logo)),
        html.Hr(),
        html.P(
            "A simple sidebar layout with navigation links", className="lead"
        ),
        dbc.Nav(
            [
                dbc.NavLink("Home", href="/", active="exact"),
                dbc.NavLink("Individus", href="/apps/individus", active="exact"),
                dbc.NavLink("Agees", href="/apps/agees", active="exact"),

            ],
            vertical=True,
            pills=True,
        ),
    ],
    style=SIDEBAR_STYLE
)
content = html.Div(id="page-content", style=CONTENT_STYLE )

footer = html.Div("ABC © 2022", style=FOOTER_STYLE )

app.layout = html.Div([

        dcc.Location(id="url-login"),
        dcc.Store(id="login-status", storage_type="session"),
        html.Div(id="user-status-header")

    , dcc.Location(id="url"),sidebar , content , footer ])

@app.callback(Output("page-content", "children"), [Input("url", "pathname")])
def render_page_content(pathname):
    if pathname == "/":
        return home.layout
    elif pathname == "/apps/individus":
        return individus.layout

    elif pathname == "/apps/agees":
        return agees.layout
    else :
        return html.Div([
            html.H1("404: Not found", className="text-danger"),
            html.Hr(),
            html.P(f"The pathname {pathname} was not recognised...") ])

if __name__ == " __main__":
    app.env = "development"
    app.run_server(debug=True)

```

I want to add a login page to my dash app with flask , But I didn’t know how to to this ?

---

<div class="post-metadata">

**Author:** ![firas](https://avatars.discourse-cdn.com/v4/letter/f/ba9def/32.png) [@firas](https://community.plotly.com/u/firas)\
**Post date:** [May 10, 2022, 8:52am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/2 "2022-05-10T08:52:28Z")

</div>

did u find a solution ?

---

<div class="post-metadata">

**Author:** ![sanae](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/sanae/32/22339_2.png) [@sanae](https://community.plotly.com/u/sanae)\
**Post date:** [May 10, 2022, 9:03am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/3 "2022-05-10T09:03:44Z")

</div>

hey @firas  
unfortunatekly No

---

<div class="post-metadata">

**Author:** ![firas](https://avatars.discourse-cdn.com/v4/letter/f/ba9def/32.png) [@firas](https://community.plotly.com/u/firas)\
**Post date:** [May 10, 2022, 9:19am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/4 "2022-05-10T09:19:06Z")

</div>

same problem here we hope that someone help us ! really there s a huge lack in documentation regarding ldap authentification

---

<div class="post-metadata">

**Author:** ![sanae](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/sanae/32/22339_2.png) [@sanae](https://community.plotly.com/u/sanae)\
**Post date:** [May 10, 2022, 9:21am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/5 "2022-05-10T09:21:12Z")

</div>

yes ! … I applied a lot of codes but it didn’t work for me

---

<div class="post-metadata">

**Author:** ![sanae](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/sanae/32/22339_2.png) [@sanae](https://community.plotly.com/u/sanae)\
**Post date:** [May 10, 2022, 9:22am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/6 "2022-05-10T09:22:34Z")

</div>

> [@Flask-Login suport for dash](https://community.plotly.com/t/flask-login-suport-for-dash/5934/2):
>
> This doesn’t seem to work. e.g. what’s the “myserver” below? =================================== [app1.py](http://app1.py) app = dash.Dash(name=‘app1’, server=myserver, csrf\_protect=False,url\_base\_pathname=’/app1’,loginSupported=True)

check this !  
it didn’t work for me , but you can try it

---

<div class="post-metadata">

**Author:** ![firas](https://avatars.discourse-cdn.com/v4/letter/f/ba9def/32.png) [@firas](https://community.plotly.com/u/firas)\
**Post date:** [May 10, 2022, 9:24am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/7 "2022-05-10T09:24:19Z")

</div>

i didn t get it how to move from login page to dashboard page !

---

<div class="post-metadata">

**Author:** ![firas](https://avatars.discourse-cdn.com/v4/letter/f/ba9def/32.png) [@firas](https://community.plotly.com/u/firas)\
**Post date:** [May 10, 2022, 9:24am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/8 "2022-05-10T09:24:36Z")

</div>

if you have a code pls share it with me

---

<div class="post-metadata">

**Author:** ![firas](https://avatars.discourse-cdn.com/v4/letter/f/ba9def/32.png) [@firas](https://community.plotly.com/u/firas)\
**Post date:** [May 10, 2022, 9:25am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/9 "2022-05-10T09:25:14Z")

</div>

myserver i think is the flask server like this server = Flask( **name** )

---

<div class="post-metadata">

**Author:** ![sanae](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/sanae/32/22339_2.png) [@sanae](https://community.plotly.com/u/sanae)\
**Post date:** [May 10, 2022, 10:11am UTC](https://community.plotly.com/t/dash-multipage-app-with-flask-login/63768/10 "2022-05-10T10:11:36Z")

</div>

> **[GitHub - RafaelMiquelino/dash-flask-login: Implementation of Flask-login on...](https://github.com/RafaelMiquelino/dash-flask-login)**
>
> Implementation of Flask-login on top of Dash. Contribute to RafaelMiquelino/dash-flask-login development by creating an account on GitHub.

I think this is helpful … wish that can help you  
I’ll try it and I’ll share my results
