__name__ module not working correctly in multi page app

Dash Python
1

I have been trying to use path variables in my multi page app, but I am always ending up with 404 page not found errors when including a path variable. I found an example of multipage apps from @AnnMarieW on github (GitHub - AnnMarieW/dash-multi-page-app-demos: Minimal examples of multi-page apps using the pages feature in dash>=2.5.1), but I am running into the same issue. For example, in the basic app included in the github, the code includes

path_template=“/asset/<asset_id>/department/<dept_id>
path=”/asset/inventory/department/branch-1001d

When i run the app and use localhost/app1/asset/inventory/department/branch-1001, I get a 404 error

Am I using path variables wrong, or is this a bug?

2

@NiBk
oops - it looks like the app.py in the multi_page_basics example was changed by mistake a few days ago. I just restored it. :upside_down_face:

There are other apps that use the path variables that were unaffected, such the multi_page_table_links example. Do you see the same error with that app?

1 Like
3

Yes, thank you, the table_links page worked great! What was changed in the basics app.py file as that was what I was using as sort of a template?
Thanks again

4

If you refresh the library, does the basic app work for you now? If you run multi_page_basics/app.py and you see a figure, then it’s the version with the wrong file. It’s totally unrelated to multi-page apps, I just saved that file to the wrong project by mistake.

5

After some testing it seems my pages are breaking because of one error. Whenever I used dash.register_page(__name__) and then print __name__, I find that most of the pages have a module, or __name__, that follows pages.TITLE except one file that is only pages. . What is even more strange is that this is the only page that is added to the page_registry. Do you have any idea what might be causing this?

6

I did find that when using dash.register_page("some name", layout = pagename.layout)for each page the site seems to work, but I don’t know if this comes with any drawbacks.

7

@NiBk This sounds odd Can you make a minimal example that reproduces this?

8

When using the multi_page_basics_pathname_prefix in the github mentioned a few posts above and only changing the code so that __name__ is printed, each page returns just pages. but pages. is also added to the page_registry, there is just no path to access any of these pages/files.

9

I am using IDLE with Python 3.9 and a __pycache__ folder is being generated

10

Are you using Jupyter?
Does anything from this issue look similar to what you are seeing: ModuleNotFoundError: No module named 'pages.' · Issue #113 · plotly/dash-labs · GitHub

11

No, I am using IDLE to compile and I am not getting any actual errors. Whenever I try to access anything that is not the main page, I get just get a 404 page.

12

After creating a virtual environment and installing the newest versions of libraries that I needed, my pages worked great.

1 Like
13

Hi @AnnMarieW,

It’s great to see this support for multipage apps, very nice implementation with a flask-like API!

I am having trouble getting pages with path_template to work, with the following setup:

image

home.py

dash.register_page(__name__, path="/")

def layout(**kwargs):

base_page.py

dash.register_page(
    __name__,
    name="Pages",
    path_template="/pages/<page_slug>",
    title=title,
    description=description,
    path="/pages/child-eduction",
)

def layout(page_slug=None, **query_parmas):
    print_registry()

    page = Page.query.filter_by(slug=page_slug).first_or_404()

What seems to be happening is that any URL is resolving to the base_page route, even / and even /admin provided by Flask-Admin, which of course throws a 404 as page_slug s not populated, the page registry looks like this:

{'pages.home': {'module': 'pages.home',
                'supplied_path': '/',
                'path_template': None,
                'path': '/',
                'supplied_name': None,
                'name': 'Home',
                'supplied_title': None,
                'title': 'Home',
                'description': '',
                'order': 0,
                'supplied_order': None,
                'supplied_layout': None,
                'supplied_image': None,
                'image': None,
                'image_url': None,
                'redirect_from': None,
                'relative_path': '/',
                'layout': <function layout at 0xffff5c1addc0>},
 'pages.base_page': {'module': 'pages.base_page',
                     'supplied_path': '/pages/child-eduction',
                     'path_template': '/pages/<page_slug>',
                     'path': '/pages/child-eduction',
                     'supplied_name': 'Pages',
                     'name': 'Pages',
                     'supplied_title': <function title at 0xffff5ca0bee0>,
                     'title': <function title at 0xffff5ca0bee0>,
                     'description': <function description at 0xffff5c1a1940>,
                     'order': None,
                     'supplied_order': None,
                     'supplied_layout': None,
                     'supplied_image': None,
                     'image': None,
                     'image_url': None,
                     'redirect_from': None,
                     'relative_path': '/pages/child-eduction',
                     'layout': <function layout at 0xffff5c1a1a60>}}

Flask routes are the following:

Endpoint                                                                 Methods    Rule
-----------------------------------------------------------------------  ---------  -----------------------------------------------------------------------
/                                                                        GET        /
/<path:path>                                                             GET        /<path:path>
/_dash-component-suites/<string:package_name>/<path:fingerprinted_path>  GET        /_dash-component-suites/<string:package_name>/<path:fingerprinted_path>
/_dash-dependencies                                                      GET        /_dash-dependencies
/_dash-layout                                                            GET        /_dash-layout
/_dash-update-component                                                  POST       /_dash-update-component
/_favicon.ico                                                            GET        /_favicon.ico
/_reload-hash                                                            GET        /_reload-hash
_dash_assets.static                                                      GET        /assets/<path:filename>
admin.index                                                              GET        /admin/
admin.static                                                             GET        /admin/static/<path:filename>
fileadmin.action_view                                                    POST       /admin/fileadmin/action/
fileadmin.delete                                                         POST       /admin/fileadmin/delete/
fileadmin.download                                                       GET        /admin/fileadmin/download/<path:path>
fileadmin.edit                                                           GET, POST  /admin/fileadmin/edit/
fileadmin.index                                                          GET        /admin/fileadmin/old_b/<path:path>
fileadmin.index                                                          GET        /admin/fileadmin/old_index
fileadmin.index_view                                                     GET        /admin/fileadmin/b/<path:path>
fileadmin.index_view                                                     GET        /admin/fileadmin/
fileadmin.mkdir                                                          GET, POST  /admin/fileadmin/mkdir/<path:path>
fileadmin.mkdir                                                          GET, POST  /admin/fileadmin/mkdir/
fileadmin.rename                                                         GET, POST  /admin/fileadmin/rename/
fileadmin.upload                                                         GET, POST  /admin/fileadmin/upload/<path:path>
fileadmin.upload                                                         GET, POST  /admin/fileadmin/upload/
page.action_view                                                         POST       /admin/page/action/
page.ajax_lookup                                                         GET        /admin/page/ajax/lookup/
page.ajax_update                                                         POST       /admin/page/ajax/update/
page.create_view                                                         GET, POST  /admin/page/new/
page.delete_view                                                         POST       /admin/page/delete/
page.details_view                                                        GET        /admin/page/details/
page.edit_view                                                           GET, POST  /admin/page/edit/
page.export                                                              GET        /admin/page/export/<export_type>/
page.index_view                                                          GET        /admin/page/
static                                                                   GET        /static/<path:filename>

And my requirements are:

orjson
dash_treeview_antd
dash==2.6.1
dash-bootstrap-components==1.1.0
dash-core-components==2.0.0
dash-html-components==2.0.0
dash-renderer==1.9.0
dash-table==5.0.0

flask-cors==3.0.10
Flask-Admin==1.6.0
flask-sqlalchemy==2.5.1
Flask-Migrate==3.1.0
slugify

Any pointers for me on what could be wrong here?

Thanks,
James

14

Hi @jcward and welcome to the Dash community :slightly_smiling_face:

I’d like to help, but there is not enough information provided. Can you make minimal example that duplicates the issue? With multi-page apps, it’s often easier to put it in GitHub rather than post the code here.

Have you tried running one of the examples with a path template from this library: (You could try example #12)