SuperAPI AI 工具集

metabase-full-app-to-modular-embedding-upgrade

前端与建站

查看项目

更新于 10-16 14:37

技能介绍

用途

该技能负责把项目从 Metabase Full App / Interactive(基于 iframe)嵌入迁移到 Modular(基于 Web Component、通过 embed.js 加载)嵌入。它是一份按顺序执行的迁移工作流,每一步的输出作为下一步的输入,跳过步骤会导致迁移结果错误。

主要能力

  • 检测并确认 Metabase 实例版本:从 Docker 镜像标签(metabase/metabase:v、metabase/metabase-enterprise:v)、METABASE_VERSION 或版本引用中查找,并始终通过 AskUserQuestion 让用户确认;如果版本为 v52 或更早则中止(Modular 嵌入自 v53 引入)。
  • 按确认版本拉取文档:使用 https://www.metabase.com/docs/v0.{VERSION}/llms-embedding-full.txt(版本号归一化,如 0.58.1 → 58 → v0.58),该文件是该版本嵌入文档的权威来源。
  • 项目扫描:识别后端语言与框架(package.json、requirements.txt、Gemfile、pom.xml、go.mod、composer.json 等)、模板引擎;查找所有 Metabase iframe;查找 SSO/JWT 认证代码(/auth/sso、/sso/metabase、jwt.sign、JWT_SHARED_SECRET、return_to 等);定位定义 HTML <head> 的布局/head 文件;查找 METABASE_ 与 MB_ 前缀的配置变量。
  • iframe 分析与 Web Component 映射:解析 iframe URL 中的 Metabase 基础地址、资源路径、资源类型与 ID(数字 ID、数字 ID+slug、entity ID),并映射为组件:/dashboard/{id} 或 /dashboard/entity/{entity_id} → <metabase-dashboard dashboard-id="...">;/question/{id} 或 /question/entity/{entity_id} → <metabase-question question-id="...">;/model/{id} 或 /model/entity/{entity_id} → <metabase-question question-id="...">;/collection/{id} 或 /collection/entity/{entity_id} → <metabase-browser initial-collection="...">;根路径 / → <metabase-browser initial-collection="root">。注意含 slug 的 ID 必须去掉 slug 部分。
  • 参数映射:丢弃 top_nav、side_nav、logo、search、new_button、breadcrumbs 等只属于 Metabase 应用外壳的参数;header=false 映射为组件上的 with-title="false",action_buttons=false 映射为 drills="false";locale={code} 映射为 window.metabaseConfig 中的 locale。
  • 代码变更:在布局/head 文件中注入一次 <script defer src="{METABASE_SITE_URL}/app/embed.js"></script>,并在其之前设置一次 window.metabaseConfig(注意不存在 defineMetabaseConfig() 函数,需直接赋值对象);将现有 SSO 端点改为只返回 JSON,响应体必须是 { "jwt": "<token>" },不再保留基于重定向的旧认证流程,且不修改 JWT 签名逻辑。
  • 验证与总结:对每项校验输出通过/失败及证据,最后给出总结。

使用方式

按固定输出结构执行:Step 0 Metabase 版本检测、Step 0.1 迁移计划清单、Step 1 项目扫描、Step 2 iframe 分析与 Web Component 映射、Step 3 迁移计划、Step 4 应用的代码变更、Step 5 验证、Step 6 最终总结。每一步结尾标注 Status: ✅ complete 或 Status: ❌ blocked;只有前一步完成才进入下一步。若因信息缺失或工具失败无法完成,需将步骤标记为 ❌ blocked、说明缺失或失败的具体内容并停止。

执行要求

  • 遵循项目既有架构、模板引擎、布局/局部模板系统、代码风格与路由模式,不切换范式;如果应用有共享模板变量的中间件,优先复用而非在路由处理器中重复。
  • 每一步内尽量并行(同一消息内使用并行的 Grep/Glob/Read 调用)。项目扫描不使用子代理,以避免后续步骤交叉引用时上下文丢失。不解析仓库分支、提交、PR 或 issue。
  • 不得参考 GitHub PR/issue 或 npm 页面,不通过改动日志链接跳转到 GitHub,不猜测 URL。
  • 迁移是完整迁移而非渐进式,旧的 iframe 嵌入被完全替换,因此重定向行为不再需要。

需要向用户提问并暂停等待回答的情况

无法从项目代码或环境变量确定 Metabase 实例 URL;需要确认 Metabase 实例版本(即使代码中已检测到也要确认);iframe URL 模式不匹配任何已知资源类型(dashboard、question、collection、home);无法在项目中找到 SSO/JWT 端点;无法定位布局/head 文件;存在多个布局文件且不清楚该使用哪一个;无法确定后端语言;多个 iframe 指定了不同的 locale 值(需让用户决定在 window.metabaseConfig 中设置哪一个,因为 Modular 嵌入只支持一个全局 locale)。

适用场景

后端语言不限(Node.js、Python、Ruby、PHP、Java、Go、.NET 等),模板引擎不限,在需通过 AskUserQuestion 时以对应语言相关指令执行;典型场景为已有基于 iframe 的 Metabase Full App / Interactive 嵌入、希望升级为 Web Component 形式的 Modular 嵌入。

限制

不处理从 Static(签名/访客)嵌入的迁移。Modular 嵌入不支持 Metabase 应用外壳(无顶部导航、侧边栏、logo、搜索栏、+New 按钮、面包屑),相关参数会被丢弃。v52 及更早版本因缺少 Modular 嵌入能力而中止。文档来源仅限于指定版本的 llms-embedding-full.txt。