摘要：上期给大家介绍过魔搭社区提供的MCP广场从而实现MCP扩展功能，还有我们通过图片生成html.本期文章将2个功能整合，另外考虑到有的小伙伴可能有私有化部署实现一个类似魔搭社区MCP广场，这样在公司内部或者客户内部就可以实现一个MCP服务功能了。从而方便其他各个
上期给大家介绍过魔搭社区提供的MCP广场从而实现MCP扩展功能，还有我们通过图片生成html.本期文章将2个功能整合，另外考虑到有的小伙伴可能有私有化部署实现一个类似魔搭社区MCP广场，这样在公司内部或者客户内部就可以实现一个MCP服务功能了。从而方便其他各个子系统扩展MCP功能。下面给大家展示一下制作好的工作流截图。
以上工作流主要有2块功能，功能1 主要实现图片识别并生成HTML 页面。（有之前网友给我留言说这块如何制作，这块给大家解答一下）。另外一个功能就是下面的直接调用AI agent智能体生成HTML 页面。
话不多说下面给大家介绍一下这工作流是如何制作的。
有的小伙伴可能会好奇，这个私有化MCP广场是如何实现的呢。答案非常简单就是借助一个叫做1Panel的开源项目。该项目是一个现代化、开源的 Linux 服务器运维管理面板。该面板最近升级也支持MCP Server,我们主要借助它来实现的。
这个1Panel安装比较简单，打开可以参考官方文档https://1panel.cn/docs/installation/online_installation/ 平台支持在线和离线安装
大家根据文档步骤操作即可完成1Panel安装，这里就不做详细展开了。
安装好1Panel 地址，账号和密码登录系统，后我们选择MCP,点击创建MCP server
在右边面板弹出MCP server 配置，这里我们以EdgeOne Pages MCP为案例配置。
https://mcp.so/server/edgeone-pages-mcp/TencentEdgeOne?tab=content 我们在这网站找到 Server Config 配置
回到1Panel MCP配置窗口中，点击“导入MCP Server配置”
接下来我们需要填写端口 和外部访问路径（如果是局域网这里就不需要设置），我打开端口外部访问，填写端口号， 外部访问路径 3个值
这里解释一下，他们是通过容器方式将 edgeone-pages-mcp 打包成容器 对外开启8004端口。这里会占用服务器一个端口号，如果是外部访问需要服务器开通对外映射的公网地址和端口。如果局域网 外部访问地址 换成局域网地址即可（如：192.168.1.XXX:8004）
以上配置好，后1Panel 会创建一个edgeone-pages-mcp 容器，我们可以在容器管理中查看到
以上操作我们就完成了一个之前需要再本地化安装的NPX安装转换成容器方式并将studio方式成功转成容器托管SSE方式了。
之前有小伙伴在windwos平台上安装npx识别的问题 也可以通过上面的方式变相解决。这里我们总结了一下它的优点和缺点：
资源瓶颈风险 单节点承载全量服务请求可能导致资源集中消耗，多实例部署需绑定独立端口，可能引发端口资源竞争问题。公网安全策略待强化 当前依赖IP白名单机制实现基础访问控制，但公网暴露场景下仍存在潜在安全风险。建议后续通过集成动态鉴权（如Token/Bearer认证）增强通信安全性。其他的MCP-server大家参考edgeone-pages-mcp安装即可。
我们回到dify工作台上面。
在制作工作流之前我们需要安装好 agent策略，这个插件可以在插件市场找到。
选择上面截图中的MCP Agent策略安装。安装完成后我们可以在已安装的插件列表中查询到。
这个开始节点比较简单没有其他需要用户输入的地方。
不过这个工作流用到了文件上传，所以我们需要在功能列表中设置一下文件传输。
开始节点之后我们设置一个问题分类器。
问题分类器模型我们这里使用硅基流动提供的qwen2.5-VL-7B-Instruct 模型。因为我们这里用到2类MCP-Server 这些服务主要围绕 游戏制作和图片生成HTML 我们根据他们的特点划分成2类。
分类1
图片识别分类2
小游戏接下来流程会走2个分支，我们先说一下上面的流程分支
llm大语言模型这个地方主要是利用多模型图片识别能力，生成类似的HTML代码。我们这里用了google gemini2.5-flash模型
系统提示词如下
请根据用户上传的图片内容信息，保持内容的颜色布局和风格，注意CSS表和表格内容，生成 html页面代码视觉模型这里注意勾选上
Agent策略这里我们需要提前安装一个叫做“MCP Agent 策略” 选择 function calling
模型这块我们还是建议大家使用火山引擎的deepseekv3 模型。工具列表中，我们找一个时间的工具
MCP 服务器地址，这里我们就填写刚才在1Panel 配置 mcp-server SSE url
指令
请根据{{#1746245138243.text#}} 先生成html页面代码，然后在调用edgeone-pages-mcp-server 生成页面返回查询
{{#sys.query#}}完整的Agent如下
直接回复里面我们为了调试方便，让大模型输出2个值 一个是多模态模型生成的JHTML 页面代码，一个是调用Agent返回的edgeone
最后输出的如下
这个是问题分类器第二个问题分类接入，主要的功能是用户输入的提示词通过调用AI Agent来生成网页版本HTML页面小游戏。这里的配置和上面的Agent非常类似，这里就不做详细介绍了。
7.直接回复
这个直接回复主要是正对Agent生成游戏HTML 生成的结果返回，也是比较简单。
以上我就完成了整个工作流的制作和搭建了。
我们点击右上角 预览按钮，在下面输入我们的问题。比如
给我生成一个贪吃蛇小游戏第二个问题
请根据这个图片的内容生成html页面代码生成的结果地址 https://mcp.edgeone.site/share/lwrn3jsviyd8yfxIRX-cQ
我们这里也提供给大家一个地址给大家来体验。
体验地址https://difyhs.duckcloud.fun/chat/4CIhdc8rzZwUjeRa 备用地址（http://14.103.204.132/chat/4CIhdc8rzZwUjeRa）
相关资料和文档可以看我开源的项目 https://github.com/wwwzhouhui/dify-for-dsl
今天主要带大家了解并实现了将图片生成 HTML 和网页小游戏打造超级智能体的工作流方案，同时还介绍了私有化 MCP 广场的部署和搭建方法。我们借助 1Panel 开源项目完成了私有化 MCP 广场的部署和搭建。一步一步带大家完成工作流智能体的搭建。对工作流进行了验证及测试，输入 “给我生成一个贪吃蛇小游戏” 和 “请根据这个图片的内容生成 html 页面代码” 等问题，得到了相应的结果，并提供了体验地址和相关资料文档。总体来说，这个方案相对较为全面地整合了图片生成 HTML 和网页小游戏生成的功能，并且提供了私有化部署的选项。感兴趣的小伙伴可以按照本文步骤去尝试。今天的分享就到这里结束了，我们下一篇文章见。
来源：不及时测评