自定义page_folder的Dash多页应用404页面失效问题求助

你遇到的问题是：自定义404页面仅在直接访问/404路径时生效，访问未知路径（如/bar）时显示Dash默认404页面。以下是两种可行的解决方案：

方案一：使用官方not_found_layout参数（推荐） #

Dash的Dash类初始化时支持not_found_layout参数，直接指定该参数为自定义404布局，所有未匹配的路由都会自动加载这个页面。

修改步骤： #

1. 在app.py中导入not_found_404模块
2. 初始化应用时添加not_found_layout=not_found_404.layout
3. 可选：保留/404路径的注册（方便直接访问）

修改后的app.py代码：

from dash import Dash, html, dcc
import dash
from modules import home, foo, not_found_404  # 导入404模块

pages_folder = "modules"
app = Dash(__name__, 
           use_pages=True, 
           pages_folder=pages_folder, 
           url_base_pathname="/super-app/",
           not_found_layout=not_found_404.layout)  # 指定自定义404布局

dash.register_page(home.__name__, path="/", layout=home.layout)  
dash.register_page(foo.__name__, path="/foo", layout=foo.layout)
# 可选：保留直接访问/404的路由
dash.register_page(not_found_404.__name__, path="/404", layout=not_found_404.layout)

app.layout = html.Div([
    html.H1('Multi-page app with Dash Pages'),
    html.Div(
        [
            html.Div(
                dcc.Link(
                    f"{page['name']} - {page['path']}", href=page["relative_path"]
                )
            )
            for page in dash.page_registry.values() if page['path'] not in ['/404']
        ]
    ),
    dash.page_container
])


if __name__ == '__main__':
    app.run_server(debug=True)

方案二：通过回调捕获路由变化（复杂场景适用） #

如果需要在路由未匹配时执行额外逻辑（比如日志记录、权限校验），可以通过dcc.Location监听路径变化，动态切换页面内容。

修改步骤： #

1. 在app.layout中添加dcc.Location组件
2. 编写回调函数，判断当前路径是否在已注册页面列表中，否则返回自定义404布局

修改后的app.py代码：

from dash import Dash, html, dcc, Input, Output, callback
import dash
from modules import home, foo, not_found_404

pages_folder = "modules"
app = Dash(__name__, 
           use_pages=True, 
           pages_folder=pages_folder, 
           url_base_pathname="/super-app/")  

dash.register_page(home.__name__, path="/", layout=home.layout)  
dash.register_page(foo.__name__, path="/foo", layout=foo.layout)
dash.register_page(not_found_404.__name__, path="/404", layout=not_found_404.layout)

# 提取所有已注册页面的路径
registered_paths = {page['path'] for page in dash.page_registry.values()}

app.layout = html.Div([
    dcc.Location(id='url', refresh=False),
    html.H1('Multi-page app with Dash Pages'),
    html.Div(
        [
            html.Div(
                dcc.Link(
                    f"{page['name']} - {page['path']}", href=page["relative_path"]
                )
            )
            for page in dash.page_registry.values() if page['path'] not in ['/404']
        ]
    ),
    html.Div(id='page-content')
])

@callback(Output('page-content', 'children'),
          Input('url', 'pathname'))
def display_page(pathname):
    # 处理url_base_pathname，转换为相对路径
    relative_path = pathname.replace(app.config.url_base_pathname, "", 1) or "/"
    # 判断路径是否已注册
    if relative_path in registered_paths:
        return dash.page_container
    else:
        return not_found_404.layout

if __name__ == '__main__':
    app.run_server(debug=True)

注意事项 #

• 方案一是Dash官方推荐的实现方式，配置简洁，无需额外逻辑，适合绝大多数场景
• 确保not_found_404.py中的布局代码没有语法错误，能正常渲染
• Docker部署时，确认镜像构建过程中包含了modules目录下的所有文件，路径映射正确

内容的提问来源于stack exchange，提问作者RubberDuckDebugging