rasa-webchat

项目介绍：Rasa Webchat

Rasa Webchat 是一个可以将通过 Rasa 或 Botfront 制作的虚拟助手部署到任何网站上的聊天控件。用户可以在他们的网站中轻松集成和使用这个功能强大的工具。

功能

Rasa Webchat 提供多种功能以提升用户的聊天体验：

文本消息：支持与用户通过文本进行交互。
快捷回复：用户可以快速选择回复选项。
图像和轮播：支持在对话中显示图像和轮播内容。
Markdown 支持：文本内容中支持 Markdown 格式。
持久会话：保持会话状态，用户不会因刷新页面而丢失聊天记录。
打字指示：显示机器人正在打字的提示。
消息间智能延迟：模拟更真实的人机对话节奏。
简单易用的集成方式：可以通过 script 标签或者 React 组件导入。

如何使用

使用 `<script>` 标签

在 HTML <body/> 中，可以通过以下方式引入 Rasa Webchat：

<script>!(function () {
  let e = document.createElement("script"),
    t = document.head || document.getElementsByTagName("head")[0];
  (e.src =
    "https://cdn.jsdelivr.net/npm/rasa-webchat@1.x.x/lib/index.js"),
    (e.async = !0),
    (e.onload = () => {
      window.WebChat.default(
        {
          customData: { language: "en" },
          socketUrl: "https://bf-botfront.development.agents.botfront.cloud",
          // 添加其他属性在此处
        },
        null
      );
    }),
    t.insertBefore(e, t.firstChild);
})();
</script>

建议使用特定版本号来预防因版本更新导致的不兼容问题，例如 1.0.0 版。

作为 React 组件

可以通过 npm 包安装 Rasa Webchat，并在 React 项目中使用：

npm install rasa-webchat

接着在项目中导入并使用组件：

import Widget from 'rasa-webchat';

function CustomWidget = () => {
  return (
    <Widget
      initPayload={"/get_started"}
      socketUrl={"http://localhost:5500"}
      socketPath={"/socket.io/"}
      customData={{"language": "en"}} // 自定义数据
      title={"Title"}
    />
  )
}

注意：如果你希望嵌入在网页中，需要将 embedded 属性设置为 true。