Dataiku环境下Flask嵌入Dash应用部署404错误求助

本地按教程将Dash嵌入Flask应用运行正常，但部署到Dataiku生产环境后，页面可加载，但访问Dash应用时出现404错误：请求URL指向Dataiku前端地址https://dss-20eb47c0-dde60339-dku.eu-west-3.app.dataiku.io/dashapp/，而非正确的后端服务地址。

由于我的Dash应用依赖assets、pages文件夹及多个自定义模块，无法使用Dataiku内置的Dash WebApp功能（该功能不支持指定这些自定义文件夹），已调试3天仍未解决，求可行解决方案或替代架构/部署方案。

后端代码（Flask实例由Dataiku提供） #

import dataiku
import pandas as pd
from flask import request, Flask
from dash import Dash, dash, html
from datetime import datetime 
import json  # 原代码遗漏该模块，需添加

server = app
dash_app = dash.Dash(server=server, routes_pathname_prefix="/dashapp/",)
dash_app.layout = html.Div("This is the dash app")

@server.route("/dashapp/")
def my(server):
    return dash_app.index()

@server.route("/firstcall")
def index():
    current_time = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
    return json.dumps({"status": "ok", "data": current_time})

前端代码 #

const backendURL = dataiku.getWebAppBackendUrl("/firstcall");

window.onload = function() {
    var ifrm = document.createElement("iframe");
    ifrm.setAttribute("src", backendURL);
    document.body.append(ifrm);

    var link = document.createElement("a");
    link.href = "/dashapp/";
    link.textContent = "Go to Dash App";
    document.body.appendChild(link);
};

解决方案 #

1. 移除冲突的Flask路由 #

Dash会自动为routes_pathname_prefix指定的路径注册路由，手动定义的/dashapp/路由会导致冲突，删除以下代码：

@server.route("/dashapp/")
def my(server):
    return dash_app.index()

2. 生成正确的Dash后端URL #

前端直接使用/dashapp/无法指向Dataiku的WebApp后端，需用dataiku.getWebAppBackendUrl()生成正确地址：

// 修改前端链接代码
var link = document.createElement("a");
link.href = dataiku.getWebAppBackendUrl("/dashapp/");
link.textContent = "Go to Dash App";
document.body.appendChild(link);

3. 配置Dash的请求路径前缀（关键） #

在Dataiku环境中，WebApp后端有专属前缀，需为Dash设置requests_pathname_prefix，确保静态资源和API请求路径正确：

# 获取Dataiku WebApp的后端前缀
backend_prefix = dataiku.get_webapp_config().get("backendPrefix", "")

dash_app = dash.Dash(
    server=server,
    routes_pathname_prefix="/dashapp/",
    requests_pathname_prefix=f"{backend_prefix}/dashapp/"
)

4. 替代部署方案 #

若上述调整仍无法解决，可尝试：

• 独立部署Dash：将Dash应用单独部署为独立服务，在Dataiku WebApp中通过iframe嵌入该服务的公开地址（需确保网络连通）
• 自定义Dataiku插件：开发插件扩展内置Dash WebApp功能，支持加载自定义assets和pages文件夹

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