Rasa接入Bot Framework的MS Teams Bot如何集成Fluent UI定制前端

你要的自定义界面效果完全能实现，没有技术上的硬阻断。 #

很多开发者接完Rasa+Bot Framework跑通Teams之后，看到默认的朴素按钮就觉得Teams给第三方机器人的UI限制很死，其实这是普遍的认知误区：

• Bot Framework本质就是个跨渠道消息转发的管道，它根本不负责在Teams里绘制界面
• 你在Teams里看到的所有机器人消息，不管是纯文本、按钮还是卡片，都是管道把结构化消息传给Teams客户端之后，由Teams自己用原生Fluent UI组件渲染出来的
• 你现在看到的默认简陋效果，纯粹是Rasa对接Bot Framework的桥接逻辑太基础——默认把Rasa输出的快捷回复、普通文本，直接转成了最基础的消息格式，根本没用到Teams原生支持的自定义卡片能力，不是Teams不让你调整样式。

你已经有跑稳的Rasa+Bot Framework+Teams链路，完全不用推翻重来，只要在桥接层做轻量化改动即可，根本不需要调整Rasa的核心对话逻辑：

• 把桥接层默认输出的纯文本、基础Hero Card消息，替换成Teams完全兼容的自适应卡JSON结构，直接推给Bot Framework就行
• 所有你想要的定制效果，全部可以在自适应卡的JSON定义里实现，不需要自己写前端代码、也不需要修改Bot Framework的前端源码：
  • 要做差异化按钮：直接在卡片的动作配置里选择内置样式就行，比如需要突出的主操作按钮做实心强调色，普通次操作按钮做描边样式，危险操作按钮做警示红色，这些都是自适应卡原生支持的属性
  • 要做自定义图文卡片：用卡片自带的容器、分栏、图片组件自由拼装布局，不管是分区展示、图文混排的效果，都能和你参考的目标界面完全对齐

小提示：你完全不需要自己用Fluent UI写组件，Teams收到你发的自适应卡JSON之后，会自动调用本地的原生Fluent UI组件渲染，最终出来的视觉效果和微软官方自己做的Teams界面没有任何差异，不存在第三方机器人拿不到原生渲染权限的问题。

不少旧教程说自定义Teams机器人界面必须用Bot Framework的JS/C# SDK从零开发，其实根本不是——不管你底层用的是Rasa还是其他对话框架，只要桥接层往Bot Framework传的消息是符合规范的自适应卡，能拿到的UI定制权限，和原生SDK开发的机器人没有任何区别。

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