agentspace中生成网页有三种路径:一是用“网页生成”mcp直出静态页;二是绑定“飞书文档+图像工具”mcp输出图文网页;三是通过“终端操作”mcp启动本地开发服务。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜

AgentSpace 中直接生成网页的三种路径
在 AgentSpace 平台中快速产出可运行网页,无需本地编码、不装 Node.js、不配 Webpack,核心依赖其预置能力与 MCP 扩展组合。你只需描述需求,Agent 会自动生成 HTML/CSS/JS 文件并提供预览链接或下载包。
方法一:用「网页生成」MCP 直出静态页
进入工作空间 → 点击「添加工具」→ 搜索并启用「网页生成」MCP → 输入明确指令,例如:“生成一个含标题、三张响应式图片轮播、底部联系表单的个人作品集首页,主题色为深蓝+白” → 点击运行 → 等待 10–25 秒 → 自动生成带内联样式的 HTML 文件,点击「预览」即可在新标签页打开实时效果。
方法二:绑定「飞书文档 + 图像工具」MCP 输出图文网页
此法适合内容驱动型页面,如活动页、产品介绍页。先写结构化提示:“生成一篇介绍‘AI 测试助手’的宣传页,包含功能亮点(3项)、客户评价(2条)、截图示意(需生成 2 张带标注的界面图)”,再绑定飞书文档和图像工具 MCP → Agent 将自动排版文字、调用图像工具生成配图、插入 HTML img 标签,并导出为完整 HTML 包(含 assets 文件夹)。
【注意:图像工具生成的图片默认为 PNG,若需 SVG 或适配暗色模式,必须在提示中明确写出“输出 SVG 格式”或“适配深色背景”】
方法三:通过「终端操作」MCP 启动本地开发服务(进阶)
仅当需要热重载、调试 JS 逻辑或对接 API 时启用。前提:你的设备已安装 Python 3.9+ 且开放了本地端口 8000。提示中写:“用 Python http.server 在本地启动当前生成的 HTML 文件,端口 8000,确保能访问 index.html 并支持刷新”。Agent 将自动打包 HTML+CSS+JS → 调用终端 MCP 执行 python -m http.server 8000 → 返回本机 IP 地址和端口链接(如 http://192.168.1.10:8000),你可直接在浏览器打开调试。
让网页具备交互能力的关键设置
AgentSpace 默认生成的网页是静态的。要添加按钮点击、表单提交、数据加载等行为,必须在提示中显式声明交互意图。
第一步:在需求描述中嵌入具体动作词
不要说“做个登录页”,要说“做个登录页,包含用户名/密码输入框、‘记住我’复选框、‘登录’按钮;点击按钮后弹出‘正在验证…’提示,3 秒后跳转至 /dashboard 页面”。Agent 会据此注入 JavaScript 事件监听和 location.href 跳转逻辑。
第二步:指定是否需要后端联动
若需真实提交,必须声明协议与端点:“表单提交使用 POST 方法,目标地址为 https://api.yoursite.com/v1/login,请求头携带 X-API-Key: abc123”。Agent 将生成 fetch 调用代码,并处理 loading 状态与错误提示。
第三步:禁用默认防跨域拦截(仅限可信环境)
AgentSpace 的终端 MCP 默认启用 CORS 安全策略。如需测试本地 API,必须在提示末尾加一句:“绕过浏览器同源限制,允许前端直接调用 http://localhost:3000 接口”。否则 fetch 请求会被静默拦截,控制台无报错但无响应。
导出与部署网页文件
生成完成的网页不能只停留在预览页——必须导出为可部署文件包。
① 点击右上角「导出」按钮 → 选择「HTML 打包下载」→ 下载 ZIP 文件(含 index.html、style.css、script.js、assets/)
② 解压后检查 script.js 是否含 window.onload 或 addEventListener,确认交互逻辑已写入
③ 将整个文件夹上传至任意静态托管服务:Vercel(拖拽即部署)、GitHub Pages(推送到 gh-pages 分支)、又拍云 OSS(设 index.html 为首页)
④ 若使用 Vercel,上传后自动分配 preview URL(如 https://xxx.vercel.app),该链接可直接分享给他人访问,无需备案或服务器运维。











