用jsp写一个简易聊天室
时间: 2023-09-03 17:08:49 浏览: 145
好的,下面是一个简单的 JSP 聊天室的示例代码:
1. 在 Web 项目的 `WEB-INF` 目录下创建 `chat.jsp` 文件,用于显示聊天记录和输入框。
```jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>简易聊天室</title>
</head>
<body>
<h1>简易聊天室</h1>
<div id="chatArea" style="height: 400px; overflow: auto;"></div>
<form>
<input type="text" name="message" style="width: 80%;">
<button type="button" onclick="sendMessage()">发送</button>
</form>
<script>
var chatArea = document.getElementById("chatArea");
// 记录当前聊天内容
var chatContent = "";
// 定时请求更新聊天记录
setInterval(function() {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
var responseText = xhr.responseText;
if (chatContent != responseText) {
chatContent = responseText;
chatArea.innerHTML = responseText;
chatArea.scrollTop = chatArea.scrollHeight;
}
}
};
xhr.open("GET", "chatServlet", true);
xhr.send();
}, 1000);
// 发送聊天内容
function sendMessage() {
var messageInput = document.getElementsByName("message")[0];
if (messageInput.value.trim() != "") {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
chatContent = xhr.responseText;
chatArea.innerHTML = chatContent;
chatArea.scrollTop = chatArea.scrollHeight;
messageInput.value = "";
}
};
xhr.open("POST", "chatServlet", true);
xhr.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xhr.send("message=" + encodeURIComponent(messageInput.value));
}
}
</script>
</body>
</html>
```
2. 创建一个名为 `chatServlet` 的 Servlet,用于处理聊天记录的更新和发送。
```java
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
@WebServlet("/chatServlet")
public class ChatServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
// 聊天记录列表
private List<String> chatList = new ArrayList<>();
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 将聊天记录列表拼接成 HTML 格式字符串返回
StringBuilder sb = new StringBuilder();
for (String message : chatList) {
sb.append("<p>").append(message).append("</p>");
}
response.getWriter().write(sb.toString());
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 将客户端发送的聊天内容加入到聊天记录列表中
String message = request.getParameter("message");
if (message != null) {
chatList.add(message);
}
doGet(request, response);
}
}
```
以上就是一个简单的 JSP 聊天室的实现。当用户在页面中输入聊天内容并点击发送按钮时,会通过 AJAX 请求将内容发送给 `chatServlet`,`chatServlet` 将内容加入到聊天记录列表中,并将当前的聊天记录列表拼接成 HTML 格式字符串返回给客户端,客户端再将其显示在页面中。同时,客户端还会定时向 `chatServlet` 发送 AJAX 请求,以获取最新的聊天记录。
阅读全文