这里的实现demo来自DWR的官方实例中,我这边主要对其中用到的一些API进行注释。便于后期的学习。
1.实现原理简单剖析
1.web项目中都是通过uri地址作为唯一指定具体页面的途径
譬如说uri:/dwr/chat/java-chat.html 或者/dwr/xxx.do2.为此dwr可以通过uri获取所有在任何浏览器中打开uri的页面session
这些所有的session表示为一个集合3.有了这个集合,我们便可以对所有用户所在当前页面进行群发操作。当然这里结合Util类来
执行服务端和客户端的一些js操作。常用:
1、直接填充内容
2、调用js函数等
这样下面的例子看起来应该简单多了。
2.实现流程:
1.聊天实现类:
public class JavaChat { /** * @param text The new message text to add */ public void addMessage(String text) { // Make sure we have a list of the list 10 messages if (text != null && text.trim().length() > 0) { messages.addFirst(new Message(text)); while (messages.size() > 10) { messages.removeLast(); } } WebContext wctx = WebContextFactory.get(); String currentPage = wctx.getCurrentPage(); // Clear the input Box in the browser that kicked off this page only Util utilThis = new Util(wctx.getScriptSession()); utilThis.setValue("text",""); // For all the browsers on the current page: Collection sessions = wctx.getScriptSessionsByPage(currentPage); Util utilAll = new Util(sessions); // Clear the list and add in the new set of messages utilAll.removeAllOptions("chatlog"); utilAll.addOptions("chatlog",messages,"text"); } /** * The current set of messages */ private LinkedList messages = new LinkedList(); /** * The log stream */ protected static final Logger log = Logger.getLogger(JavaChat.class); }
2.聊天辅助bean实体:
public class Message { /** * @param newtext the new message text */ public Message(String newtext) { text = newtext; if (text.length() > 256) { text = text.substring(0,256); } } /** * @return the message id */ public long getId() { return id; } /** * @return the message itself */ public String getText() { return text; } /** * When the message was created */ private long id = System.currentTimeMillis(); /** * The text of the message */ private String text; }
3.dwr配置
<dwr> <allow> <!-- chat --> <create creator="new" javascript="JavascriptChat" scope="application"> <param name="class" value="org.getahead.dwrdemo.chat.JavascriptChat"/> </create> <create creator="new" javascript="JavaChat" scope="application"> <param name="class" value="org.getahead.dwrdemo.chat.JavaChat"/> </create> <convert converter="bean" match="org.getahead.dwrdemo.chat.Message"/> </allow> </dwr>
4.页面调用:
<head> <Meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <title>DWR Thin Chat Version 2.0</title> <script type='text/javascript' src='../dwr/engine.js'> </script> <script type='text/javascript' src='../dwr/interface/JavaChat.js'> </script> <script type='text/javascript' src='../dwr/util.js'> </script> <script type="text/javascript"> function sendMessage() { JavaChat.addMessage(dwr.util.getValue("text")); } </script> <link rel="stylesheet" type="text/css" href="../generic.css" /> </head> <body onload="dwr.engine.setActiveReverseAjax(true);"> <h1>Java Chat</h1> <p>This is a very simple chat demo that uses reverse ajax to collect messages and server-side browser manipulation to update the pages with the results.</p> <p> Your Message: <input id="text" onkeypress="dwr.util.onReturn(event,sendMessage)"/> <input type="button" value="Send" onclick="sendMessage()"/> </p> <hr/> <ul id="chatlog" style="list-style-type:none;"> </ul> </body>