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

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

一、创建一个新项目

添加所需的依赖项

  1. 打开pom.xml文件在IDE中

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

    <repository>    <id>JCenter</id>    <url>https://jcenter.bintray.com</url></repository>
  3. 将下列内容添加到<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添加到项目中:

  1. 去https://github.com/drwallace/aiml-en-us-foundation-alice .

  2. 下载zip文件包

  3. 解压缩zip文件并将内容(仅.aiml文件)复制到Maven项目中的新src/resources/bots/alice/aiml/目录(必须创建bots/alice/aiml/子目录)。

定义Bean以访问Bot逻辑

实现逻辑

  1. 在IDE中打开应用程序类

  2. 添加以下方法

@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中实现可滚动的消息列表,请执行以下操作:

  1. 创建新的MessageList类

  2. 实现类如下

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");    }}

实现聊天视图

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

  1. 在IDE中打开ChatView类

  2. 删除构造函数

  3. 将以下成员添加到类中

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样式,请执行以下操作:

  1. 打开聊天室-视图.css在IDE中的文件

  2. 添加以下选择器和规则

.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;}

生成并运行应用程序

第一次构建应用程序服务器端和客户端依赖关系时,将下载。这可能需要一些时间。但是,后续的构建要快得多。

要构建和运行应用程序,请在IDE中执行application::main(String[])标准Java应用程序入口点。或者,可以执行java-jar target/vaadin-chat-1.0-快照.jar或mvn弹簧-启动:运行命令。

您可以在浏览器中输入http://localhos:8080并运行。

原创声明:本文为【Java学习提升】原创博文,转载请注明出处。

本文来源于公众号:【Java学习提升】 专注于Java领域技术分享,Java知识体系学习、分享面试经验,让我们结伴而行,共同成长!

  • 1
    点赞
  • 29
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值