案例分析(人机客服对话):
1.在jsp页面中提前写好结构
举个例子:
<%-- 客服对话框--%>
<div id="keFu" style="display:none;margin-left: 500px;margin-top: -280px">
<div id="chat-window">
<!-- 消息显示区域 -->
</div>
<div id="message-input">
<input type="text" id="input-text" placeholder="输入聊天信息..."/>
<button id="send-button" onclick="sendMessage()">发送</button>
</div>
</div>
<%-- 结束--%>
2.定义一个接口,里面声明好方法,给它编写实现类实现;
//对话方法
String getBotResponse(String message);
实现人机客服对话只需要简单的逻辑,例如:
@Override
public String getBotResponse(String message) {
// 这里可以实现简单的逻辑,或集成 AI 聊天接口
if (message.toLowerCase().contains("你好")) {
return "你好,有什么可以帮助你的吗?";
} else if (message.toLowerCase().contains("聊聊天吧")){
return "当然可以,很庆幸能和您聊天";
}
else {
return "抱歉,我不太明白你的问题。";
}
}
3.写按钮的点击事件,发送ajax请求拿到信息发送到自己的servlet,用来处理数据。(这里样式我就不提供了)
//与人机客服的对话
function sendMessage() {
let userInput = document.getElementById("input-text").value;
if (userInput.trim() === "") return;
// 将用户消息添加到聊天框
let chatbox = document.getElementById("chat-window");
chatbox.innerHTML += "<div class='message user-message'><strong>我:</strong> " + userInput + "</div>";
// 清空输入框
document.getElementById("input-text").value = "";
$.ajax({
url: "ChatServlet",
type: "POST",
data: {
message: userInput
},
dataType: "JSON",
success: function (data) {
chatbox.innerHTML += "<div class='message bot-message'><strong>客服:</strong> " + data + "</div>";
chatbox.scrollTop = chatbox.scrollHeight; // 滚动到最新消息
},
error: function (jqXHR, textStatus, errorThrown) {
console.error("请求失败: " + textStatus, errorThrown);
}
});
}
4.在servlet中处理数据
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String userMessage = request.getParameter("message");
// 处理用户消息生成回复
String botResponse = utilDao.getBotResponse(userMessage);
// 设置响应内容类型
response.setContentType("text/plain");
PrintWriter out=response.getWriter();
out.print(JSON.toJSONString(botResponse));
out.flush();
}
能进入到doPost肯定是因为发送ajax请求的路径是post
人机客服对话效果
实现简单的对话功能
案例分析(个人思路仅供参考):
1.在数据库中准备好用来存放用户聊天记录的表:
字段包括:自动增长的id,发送消息的那个用户的id,接收消息的那个用户的id,消息内容,发送时间,,,等等,还可以有当前发送地址,或者可以发送照片等
2.在页面中也提前写好结构,并连接数据库生成聊天记录表的实体类
3.在你的工具接口中定义方法:
List<你的实体类> selectChatHistory(int 当前用户的id);
这里我接口中的方法参数为当前这个用户的id,那么我实现这个方法的sql语句,条件肯定也是按照当前这个用户id为接收消息的用户id,来查找哪个用户给我发了消息,并且要根据发送时间进行排序,不然最新的一条消息是无法显示在最好一条的 其他删除消息,发送消息要添加的方法我就不写了
4.在servlet中处理
在用户登录账号时就拿到当前用户id,调用定义的查询方法,在这里你就要提前得到之前与该用户有几条聊天记录,是否发生了长度的改变,如果是多了可以在页面中提示,这里要简单提示一下,每个当前用户肯定都是作为发消息的用户,所有给别的用户发送消息时信息可以显示在右边
用到的jar包:
连接mysql数据库的jar包:http://mysql-connector-java-8.0.19.jar
servlet的jar包:http://servlet-api.jar
以及json的jar包:http://fastjson-1.2.57.jar
本期就分享到这了,感谢阅读!