JSP实现聊天室(老卢版)

还有OA、人力资源管理系统等等。
OK，JSP的介绍到此为止。

---

下面开始搭建聊天室的界面框架。

 

 
 
 
 
 
 
 

 
   
      
    
 
  
 
  

注：无body标签。
改写到myeclipse,main.jsp

 

<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

 
   
   
   
 
 
    
 
 
 
 
 
   
      
   
 
  
 
 

发送聊天消息：
bottom.jsp

  

  
 

注：target属性：目的是将消息发送至聊天域。
main.jsp
注：将消息发送至消息区域left.jsp  给frame加上name属性。
left.jsp

 
     聊天内容：

---

   <%
       String message=request.getParameter("message");
       out.println(message);
   %>
 

注：1.可以将消息发送至left.jsp区域，但是会出现消息覆盖。
      2.发送汉字出现乱码。

---

---

解决乱码问题：
在bottom.jsp中 

采用post方式提交表单。
并且在left.jsp中修改：

  
     聊天内容：

---

   <%
        request.setCharacterEncoding("gbk");
       String message=request.getParameter("message");
       out.println(message);
   %>
 

注：现在还存在消息覆盖的问题，现在来解决。

---

---

针对消息覆盖的问题，主要原因是变量局部性的问题，因此现在引入一个全局的变量，即application容器。

 
     聊天内容：

---

   <%
        //设置乱码
        request.setCharacterEncoding("gbk");
        //取得发送的聊天信息
       String message=request.getParameter("message");
      
        String msg =(String) application.getAttribute("msg");
        //如果取不到，说明是第一次，直接把得到的信息放入容器中即可。
        if(msg==null){
            //向这个容器中装入数据
            application.setAttribute("msg",message);
        }else{
          msg=msg+"
"+message;
              application.setAttribute("msg",msg);
        }
       out.println(msg);
   %>
 

注：加入了换行，使用application，解决了消息覆盖的问题。但是还存在发送框中区域不清空和发送完消息直接跑到最上面的问题。

---

---

在left.jsp中加入即解决消息跑到最下面。
系统的js函数scroll(0,99999)。
解决null问题：

 
     聊天内容：

---

   <%
        //设置乱码
        request.setCharacterEncoding("gbk");
        //取得发送的聊天信息
       String message=request.getParameter("message");
      
        String msg =(String) application.getAttribute("msg");
        //如果取不到，说明是第一次，直接把得到的信息放入容器中即可。
        if(message!=null){
           if(msg==null){
            //向这个容器中装入数据
            application.setAttribute("msg",message);
           }else{
               msg=msg+"
"+message;
               application.setAttribute("msg",msg);
           }
        }
       out.println(msg);
   %>
 

解决自动刷新的问题：在left.jsp:
 

---

  <%
        //设置乱码
        request.setCharacterEncoding("gbk");
        //取得发送的聊天信息
       String message=request.getParameter("message");
       String ip = request.getRemoteAddr();
        String msg =(String) application.getAttribute("msg");
        //如果取不到，说明是第一次，直接把得到的信息放入容器中即可。
        if(message!=null){
           message=ip+"说："+message;
           if(msg==null){
            //向这个容器中装入数据
            application.setAttribute("msg",message);
           }else{
               msg=msg+"
"+message;
               application.setAttribute("msg",msg);
           }
        }
       out.println(msg);
   %>

---

禁止发送空消息：

发送表情：
bottom.jsp

left.jsp

  <%
        //设置乱码
        request.setCharacterEncoding("gbk");
       
        String touxiang = request.getParameter("touxiang");
        //取得发送的聊天信息
       String message=request.getParameter("message");
       String ip = request.getRemoteAddr();
        String msg =(String) application.getAttribute("msg");
        //如果取不到，说明是第一次，直接把得到的信息放入容器中即可。
        if(message!=null){
           message=ip+"说："+message+"";
           if(msg==null){
            //向这个容器中装入数据
            application.setAttribute("msg",message);
           }else{
               msg=msg+"
"+message;
               application.setAttribute("msg",msg);
           }
        }
       out.println(msg);
   %>

项目代码：

项目源码:

chat.zip