SuperAPI AI 工具集

inline-embeds

智能体与模型

查看项目

更新于 10-15 20:09

技能介绍

用途:在 agent 聊天回复中内联渲染本应用同源路由的沙箱 iframe,用可交互预览替代纯文字或静态截图,例如图表、邮件线程、幻灯片、表单、工单。

主要能力:使用语言标记为 embed 的围栏代码块,键包括 src(必填,以 / 开头的同源路径,跨域 URL 会被阻止)、aspect(可选,默认 16/9,支持 4/3、3/2、2/1、21/9、1/1)、title(可选,无障碍标签与悬停提示)、height(可选,宽高比不合适时的固定像素高度)。iframe 以 allow-scripts allow-same-origin allow-forms allow-popups 沙箱化,referrerpolicy="same-origin",浏览器会阻止其导航父窗口。

使用方式:适合需要悬停提示的图表、用户想快速浏览的详情视图,或“给个链接”会多一次点击的场景;纯文字、列表或小表格足够时不要嵌入,也不要嵌入外部站点。每个嵌入路由应包含“Open”按钮,从 @agent-native/core/client 导入 postNavigate 与 isInAgentEmbed,按钮在嵌入环境外返回 null,点击后通过 postMessage 通知父聊天窗口;渲染器校验同源、同 iframe 且路径为相对路径后,用 history.pushState 让 react-router 无刷新导航。页面直接加载时 postNavigate 回退为同窗口导航。

添加嵌入路由:创建无外壳路由(如 app/routes/email.tsx),在 app/components/layout/Layout.tsx 中将该路径标记为 bare 以隐藏侧边栏与页头,用透明背景渲染现有详情组件,加入调用 postNavigate 的 OpenButton,并在模板的 AGENTS.md 中记录可嵌入 URL。框架级围栏渲染与安全策略自动生效,无需额外接线。

限制:仅支持同源路径,跨域被阻止;iframe 不能导航父窗口;资料未提供其他平台、收费或效果信息。