用Java实现基于Web端的AI机器人聊天

最新推荐文章于 2025-11-08 09:01:49 发布

原创最新推荐文章于 2025-11-08 09:01:49 发布 · 4.4k 阅读

29 ·

CC 4.0 BY-SA版权

文章标签：

#其他

本文详细介绍如何使用Java和AIML创建Web聊天机器人，包括项目搭建、bot逻辑实现、Web UI设计及自定义样式，助你快速掌握聊天机器人开发。

本文详细介绍了如何用Java实现Web聊天机器人。通过创建一个新项目来学习一下！

一、创建一个新项目

添加所需的依赖项

打开pom.xml文件在IDE中

将下列内容添加到<repositories>区域

<repository>    <id>JCenter</id>    <url>https://jcenter.bintray.com</url></repository>

将下列内容添加到<dependencies>区域

<dependency>    <groupId>org.goldrenard</groupId>    <artifactId>ab</artifactId>    <version>1.0.7</version></dependency><dependency>    <groupId>org.vaadin.artur</groupId>    <artifactId>avataaar</artifactId>    <version>1.0.0</version></dependency>

二、实现bot逻辑

bot逻辑是用人工智能标记语言（AIML）定义的。org.alicebot.ab.Bot类能够生成非常智能的答案。您只需要添加AIML文件并定义一个Spring管理的bean来访问bot逻辑。

添加现成的AIML文件

组成聊天机器人使用的人工智能的规则集在AIML文件中定义。您可以创建自己的或下载随时可用的文件。本文使用Richard Wallace的免费A.L.I.C.E.AIML文件。

要将A.L.I.C.E.AIML添加到项目中：

去https://github.com/drwallace/aiml-en-us-foundation-alice .
下载zip文件包
解压缩zip文件并将内容（仅.aiml文件）复制到Maven项目中的新src/resources/bots/alice/aiml/目录（必须创建bots/alice/aiml/子目录）。

定义Bean以访问Bot逻辑

实现逻辑

在IDE中打开应用程序类
添加以下方法

@Beanpublic Bot alice() {    return new Bot(BotConfiguration.builder()    .name("alice")    .path("src/main/resources")    .build()    );}@Beanpublic ScheduledExecutorService executorService() {    return Executors.newScheduledThreadPool(2);}

3. 添加以下类成员

private final Chat chatSession;

4. 添加以下构造函数public ChatService() {

    BotConfiguration botConfiguration = BotConfiguration.builder()    .name("alice")    .path("src/main/resources")    .build();    Bot bot = new Bot(botConfiguration);    chatSession = new Chat(bot);}

5. 向类中添加以下方法

public String answer(String message) {    return chatSession.multisentenceRespond(message);}

实现Web用户界面

要向应用程序添加web UI，您将实现一个UI组件来显示消息和视图。您还将添加CSS样式，使应用程序看起来像一个典型的在线聊天。

实现可滚动的消息列表

要在Java中实现可滚动的消息列表，请执行以下操作：

创建新的MessageList类
实现类如下

public class MessageList extends Div {    public MessageList() {        setClassName(getClass().getSimpleName());    }
    public void addMessage(String from, Avataaar avatar, String text, boolean isCurrentUser) {        Span fromContainer = new Span(new Text(from));        fromContainer.addClassName(getClass().getSimpleName() + "-name");        Div textContainer = new Div(new Text(text));        textContainer.addClassName(getClass().getSimpleName() + "-bubble");        Div avatarContainer = new Div(avatar, fromContainer);        avatarContainer.addClassName(getClass().getSimpleName() + "-avatar");        Div line = new Div(avatarContainer, textContainer);        line.addClassName(getClass().getSimpleName() + "-row");        add(line);        if (isCurrentUser) {            line.addClassName(getClass().getSimpleName() + "-row-currentUser");            textContainer.addClassName(getClass().getSimpleName() + "-bubble-currentUser");        }        line.getElement().callJsFunction("scrollIntoView");    }}

实现聊天视图

要实现应用程序的聊天视图，请执行以下操作：

在IDE中打开ChatView类
删除构造函数
将以下成员添加到类中

private final UI ui;private final MessageList messageList = new MessageList();private final TextField message = new TextField();private final Chat chatSession;private final ScheduledExecutorService executorService;

4. 将以下构造函数添加到类中

public ChatView(Bot alice, ScheduledExecutorService executorService) {    this.executorService = executorService;    ui = UI.getCurrent();    chatSession = new Chat(alice);    message.setPlaceholder("Enter a message...");    message.setSizeFull();    Button send = new Button(VaadinIcon.ENTER.create(), event -> sendMessage());    send.addClickShortcut(Key.ENTER);    HorizontalLayout inputLayout = new HorizontalLayout(message, send);    inputLayout.addClassName("inputLayout");    add(messageList, inputLayout);    expand(messageList);    setSizeFull();}

5. 向类中添加以下方法

private void sendMessage() {    String text = message.getValue();    messageList.addMessage("You", new Avataaar("Name"), text, true);    message.clear();  executorService.schedule(() -> {    String answer = chatSession.multisentenceRespond(text);    ui.access(() -> messageList.addMessage(        "Alice", new Avataaar("Alice2"), answer, false));  },new Random().ints(1000, 3000).findFirst().getAsInt(),               TimeUnit.MILLISECONDS);}

添加自定义样式

要向应用程序添加自定义CSS样式，请执行以下操作：

打开聊天室-视图.css在IDE中的文件
添加以下选择器和规则

.inputLayout {    width: 100%;}.MessageList {    overflow-y: scroll;    width: 100%;    height: 100%;}
.MessageList-name {    font-weight: bold;}
.MessageList-bubble {    margin: .5em;    padding: 1em;    border-radius: var(--lumo-border-radius-s);    background-color: var(--lumo-shade-20pct);}
.MessageList-bubble-currentUser {    background-color: var(--lumo-primary-text-color);    color: var(--lumo-base-color);}
.MessageList-avatar {    display: flex;    flex-direction: column;    align-items: center;    width: unset;    height: unset;    padding: 0;}
.MessageList-row {    display: flex;    align-items: center;}.MessageList-row-currentUser {    flex-direction: row-reverse;}