DWR Server Push(服务器推技术) 实现即时聊天功能(WEB)
2019独角兽企业重金招聘Python工程师标准>>>
原文 http://yourgame.iteye.com/blog/199079
当你有QQ消息时,QQ的小图标会晃动,我们甚至还可以设定QQ有消息时,自动弹出来!
这些在C/S模式下很容易实现!如果要在B/S模式如何来实现呢?
我们的肯定会想到在客服端调用ajax在后台不断的查询服务器.看是否有关于自己的消息.如果有则查询返回.这种做法肯定会大量的占用系统的资源!不可取!
现在DWR的反转AJAX功能.允许我们从服务器端来控制客服端.而不需要客户端来请求.服务器可以自动把消息发给指定的客户端!
已经实现了对指定用户发送消息的功能,并且即时显示在指定的用户界面上面.当然你可以修改这些,让它弹出来显示,或者像QQ一样在你页面的某个角落让消息的图标闪动:)
下面我做一个简单的说明:
package com.lhq; /** * 用户类 * * @author 廖瀚卿 * */
public class User { private String userid; private String username; public String getUserid() { return userid; } public void setUserid(String userid) { this.userid = userid; } public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public User(String userid, String username) { super(); this.userid = userid; this.username = username; } }
<%@ page language="java" pageEncoding="GBK"%>
<html> <head> <title>chat</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <script type='text/javascript' src='/chat/dwr/interface/ChatManager.js'></script> <script type='text/javascript' src='/chat/dwr/engine.js'></script> <script type='text/javascript' src='/chat/dwr/util.js'></script> <script type="text/javascript" src="/chat/chat.js"></script> </head> <body> <input type="hidden" name="userid" /> <br> 昵称: <input type="text" name="username" /> <input type="button" value="注册" onclick="register(this);" /> <br /> <br /> 我要对 <select name="receiver" id="receiver" disabled=true" > </select> 说: <input type="text" name="message" id="message" disabled="true" /> <input type="button" value="发送" id="send" name="send" disabled="true" onclick="send();" /> <br /> <br /> 在线用户列表: <ul id="users"> </ul> <div id="showMessage" style="display: none"> <span id="sender"></span>对你说: <span id="msg"></span> </div> </body>
</html>
package com.lhq; import java.util.ArrayList;
import java.util.Collection;
import java.util.HashSet;
import java.util.List; import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest; import org.directwebremoting.ScriptSession;
import org.directwebremoting.ServerContext;
import org.directwebremoting.ServerContextFactory;
import org.directwebremoting.WebContextFactory;
import org.directwebremoting.proxy.dwr.Util; /** * 处理聊天相关 * * @author 廖瀚卿 * */
public class ChatManager { /** 保存当前在线用户列表 */ public static List<User> users = new ArrayList<User>(); /** * 更新在线用户列表 * @param username 待添加到列表的用户名 * @param flag 是添加用户到列表,还是只获得当前列表 * @param request * @return 用户userid */ public String updateUsersList(String username, boolean flag, HttpServletRequest request) { User user = null; if (flag) { // 这里取会话(HttpSession)的id为用户id user = new User(request.getSession().getId(), username); //保存用户到列表 users.add(user); //将用户id和页面脚本session绑定 this.setScriptSessionFlag(user.getUserid()); } //获得DWR上下文 ServletContext sc = request.getSession().getServletContext(); ServerContext sctx = ServerContextFactory.get(sc); //获得当前浏览 index.jsp 页面的所有脚本session Collection sessions = sctx.getScriptSessionsByPage("/chat/index.jsp"); Util util = new Util(sessions); //处理这些页面中的一些元素 util.removeAllOptions("users"); util.addOptions("users", users, "username"); util.removeAllOptions("receiver"); util.addOptions("receiver", users,"userid","username"); if(!flag){ return null; } return user.getUserid(); } /** * 将用户id和页面脚本session绑定 * @param userid */ public void setScriptSessionFlag(String userid) { WebContextFactory.get().getScriptSession().setAttribute("userid", userid); } /** * 根据用户id获得指定用户的页面脚本session * @param userid * @param request * @return */ @SuppressWarnings("unchecked") public ScriptSession getScriptSession(String userid, HttpServletRequest request) { ScriptSession scriptSessions = null; Collection<ScriptSession> sessions = new HashSet<ScriptSession>(); sessions.addAll(ServerContextFactory.get(request.getSession().getServletContext()) .getScriptSessionsByPage("/chat/index.jsp")); for (ScriptSession session : sessions) { String xuserid = (String) session.getAttribute("userid"); if (xuserid != null && xuserid.equals(userid)) { scriptSessions = session; } } return scriptSessions; } /** * 发送消息 * @param sender 发送者 * @param receiverid 接收者id * @param msg 消息内容 * @param request */ public void send(String sender,String receiverid,String msg,HttpServletRequest request){ ScriptSession session = this.getScriptSession(receiverid, request); Util util = new Util(session); util.setStyle("showMessage", "display", ""); util.setValue("sender", sender); util.setValue("msg", msg); }
}
/** * 注册帐号 */
function register(button) { if ($('username').value == "" || $('username').value.length <= 0) { alert("请输入昵称"); return; } /* 下面是对一些按钮的禁用和激活操作 */ $('username').disabled = true; button.disabled = true; $('message').disabled = false; $('send').disabled = false; $('receiver').disabled = false; /* 把我输入的用户名注册到服务器,并获得用户id(这里用session id 代替) */ ChatManager.updateUsersList($('username').value, true, function(data) { if (data != null && data.length > 0) { $('userid').value = data; // 注册成功,把userid放到当前页面 } });
} /** * 页面初始化 */
function init() { dwr.engine.setActiveReverseAjax(true); // 激活反转 重要 ChatManager.updateUsersList(null, false); // 当你打开界面的时候,先获得在线用户列表.
} /** * 发送消息 */
function send() { var sender = dwr.util.getValue('username'); // 获得发送者名字 var receiver = dwr.util.getValue('receiver'); // 获得接受者id var msg = dwr.util.getValue('message'); // 获得消息内容 ChatManager.send(sender, receiver, msg); // 发送消息
} window.onload = init;//页面加载完毕后执行初始化方法init
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> <servlet> <servlet-name>dwr-invoker</servlet-name> <servlet-class> org.directwebremoting.servlet.DwrServlet </servlet-class> <init-param> <description>调试DWR,发布系统时应将其设为false</description> <param-name>debug</param-name> <param-value>true</param-value> </init-param> <init-param> <description>使用服务器推技术(反转AJAX)</description> <param-name>activeReverseAjaxEnabled</param-name> <param-value>true</param-value> </init-param> <init-param> <param-name> initApplicationScopeCreatorsAtStartup </param-name> <param-value>true</param-value> </init-param> <init-param> <param-name>maxWaitAfterWrite</param-name> <param-value>100</param-value> </init-param> <load-on-startup>4</load-on-startup> </servlet> <servlet-mapping> <servlet-name>dwr-invoker</servlet-name> <url-pattern>/dwr/*</url-pattern> </servlet-mapping>
</web-app>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
<dwr> <allow> <convert converter="bean" match="com.lhq.User"/> <create creator="new" javascript="ChatManager"> <param name="class" value="com.lhq.ChatManager"/> </create> </allow>
</dwr>
转载于:https://my.oschina.net/HuifengWang/blog/232975
DWR Server Push(服务器推技术) 实现即时聊天功能(WEB)相关推荐
- Pushlet和Dwr的简单服务器推技术
附件里Pushlet和Dwr3.0的简单服务器推技术. DWR-Source.rar为DWR的学习资料. 下面简单介绍一下dwr3.0 RC2版本的反推技术代码. 首先下载dwr官方包,笔者这里下载的 ...
- Comet:基于 HTTP 长连接的“服务器推”技术 (实例)
"服务器推"技术的应用 传统模式的 Web 系统以客户端发出请求.服务器端响应的方式工作.这种方式并不能满足很多现实应用的需求,譬如: 1. 监控系统:后台硬件热插拔.LED.温度 ...
- Comet:基于HTTP长连接的“服务器推”技术
作者:周 婷 (zhouting@cn.ibm.com), 软件工程师, IBM 中国软件开发技术实验室 来源:http://www.ibm.com/developerworks/cn/web/wa- ...
- [转载] Comet:基于 HTTP 长连接的“服务器推”技术
转载自http://www.ibm.com/developerworks/cn/web/wa-lo-comet/ "服务器推"技术的应用 传统模式的 Web 系统以客户端发出请求. ...
- 基于php和服务器推技术的web即时聊天系统,基于php和服务器推技术的Web即时聊天系统...
基于php和服务器推技术的Web即时聊天系统① 王振兴, 黄静 [摘要]摘要: 基于http协议应用于Web端, 实现一个浏览器无关的.便于移植的.高性能的Web即时聊天系统. 系统使用服务器推技术中 ...
- pushlet实现服务器推技术
服务器推技术: (1)由于目前我司电话系统处理来电弹屏存在一个问题,就是客户端登录系统会触发前端js不断去请求数据库数据,并反馈给前端,如果使用者一多,将会导致系统资源高消耗: (2)目前比较成 ...
- comet - “服务器推”技术
概念 comet :基于 HTTP 长连接的"服务器推"技术,是一种新的 Web 应用架构.基于这种架构开发的应用中,服务器端会主动以异步的方式向 客户端程序推送数据,而不需要客户 ...
- Comet:基于 HTTP 长连接的“服务器推”技术解析
一.背景介绍 传统web请求,是显式的向服务器发送http Request,拿到Response后显示在浏览器页面上.这种被动的交互方式不能满足对信息实时性要求高的应用,譬如聊天室.股票交易行情.在线 ...
- 采用PHP实现”服务器推”技术的聊天室
传统的B/S结构的应用程序,都是采用"客户端拉"结束来实现客户端和服务器端的数据交换. 本文将通过结合Ticks(可以参看我的另外一篇文章:关于PHP你可能不知道的-PHP的事件驱 ...
- Live:主流技术构建即时聊天室演示应用,直播源码
Live :服务端采用 RTMP(Nginx), WebSocket(Socket.io),客户端 VideoCore+IJKPlayer 构建即时聊天室演示应用. 这个项目是为了演示如何建立一个现场 ...
最新文章
- 阿里云centos配置nginx和nodejs
- Salesforce Lightning开发学习(二)Component组件开发实践
- 电脑物理内存与虚拟内存的区别与关系
- ssl1760-商店选址问题【图论,最短路】
- linux虚拟机 dev sda2,虛擬機linux下 /dev/sda2 滿了怎么辦,測試用過,真實可行
- java两个web项目之间如何传值,两个项目之间传递参数有关问题 - 大神进
- 6-5 java简介
- fixedsys字体 win7_主编为你win7系统显示默认隐藏字体的图文办法
- objective-c中的@selector()和 c /c++的函数指针
- 亲测:优酷下载的会员独享KUX视频快速转换成MP4格式!
- pdf转dwg为什么乱码
- 盘点python socket 中recv函数的坑
- 标签上title属性与alt属性的区别是什么
- 分布电容和杂散电容_杂散电容概述
- 让你实现财富自由,从此不再缺资金
- iOS 抽取app中的图片图标资源
- js 比较两个字符串形式的时间的大小
- JQuery库的使用
- iOS雷达图 iOS RadarChart实现
- 国民技术GPIO配置推挽输出模式