Realization of online meeting system with AJAX+J2EE

This year everyone in the hype Web2.0, one of the technology Ajax is also followed by fire, so I wrote a paper called "Cheat Ajax" article, simply analyze the essence of AJAX technology. Although I do not like to follow the follow, but there are some areas of Ajax is more useful. Some time ago did a EASYJF open source team of online conferencing system, used AJAX technology, the following design ideas issued to share with you.

　　 the function of system realization

This conference room system is mainly used for members of the EASYJF open source team online meeting, the conference system simulates the traditional meeting form, can open a number of different themes at the same time meeting room, each meeting room needs to provide access control function, meeting can designate the meeting speaking mode (divided into lines, free speech two), The system can automatically record the speech information of each meeting room, which can be consulted by the participants for a long time.

The conferencing system's users support the visitor account to attend the meeting, but also provides the interface with other user's system, for instance EASYJF website Open Source Forum system.

The conference system temporarily uses text chat and provides voice and video interfaces.

　　 second, the technical system

The server side uses the Java language and MVC uses the Easyjweb framework;
The client uses AJAX technology to interact with server-side data;
Conference history Information storage format uses text format to facilitate system installation and operation, but also easy to manage.

　　 third, the conference room server Side Design

The conference Room server is the core part of the whole conference system, and the quality of the whole system is affected by the server-side program design.

First, abstract analysis is based on the functions to be implemented in the Conference room. A conference room object that should include the subject of the meeting, a brief introduction to the meeting, the number of participants, announcements, conference room types, access settings, room password, current attendees, current speakers, people waiting in line to speak, and other parameter information. We encapsulated him in a Java object. As shown in the following chatroom code:

public class chatroom{ Private String cid;//PRIMARY key Private String title;//Chat room topics Private String intro;//Chat room Introduction Private String announce;//Chat room Bulletin Private String owner;//Chat room Creator Private Integer maxuser;//Max online number Private Integer intervals;//Maximum refresh time interval Private String vrtype;//access rights Private String vrvalue;//Access value Private Integer status;//Chat room status Private Date Inputtime; }

You need a class that manages the conference room, a meeting-related operation (such as starting a meeting, closing a meeting), and so on, find him directly. The class should also have automatic timing to detect the user online (prevent users from accidentally quitting), the memory of the conference history to save the information to a text file medium function. Here you can consider using a Chatservice class to provide these features:

public class Chatservice implements Runnable { private static final Map service=new HashMap ()//Conference Room service, the current meeting room in the system is stored in the table collection Maximum number of meeting rooms that private static final int maxservices=10;//can open at the same time private static final SimpleDateFormat df=new SimpleDateFormat ("Yyyy-mm-dd"); Private final List msgs;//chat information Chat Private final List users;//online user, Chatuser Private final List talkers;//number of speakers in line talker Private final List manager;//Conference Room Manager Private Talker currenttalker;//Current spokesperson Public Chatservice () { This.msgs=new ArrayList (); This.users=new ArrayList (); This.talkers=new ArrayList (); This.manager=new ArrayList (); this.maxuser=1000;//Max 1000 people at the same time THIS.INTERVAL=1000*60*5;//5 minutes before the information } }

Conference statement information also needs to be encapsulated into a class that represents the speaker, receiver, content, speaking time, type, and so on, roughly the following chat class:

public class Chat { Private String CID; Private String sender; Private String reciver; Private String content; Private Date vdate; private Integer types; Private Integer status; }

There is also information about the person who attended the meeting, including the name of the participant, IP address, status, and so on, as shown in the following Chatuser class:

public class Chatuser { Private String IP; Private String Port; Private String UserName; Private Date LastAccessTime; Private Integer status; }

A talker class representing the current spokesperson is also required, indicating the current speaker, the starting time of the speech, the expected end time of the statement, and so on.

In the server side of the design, the conference room information servers should be able to run in a multi-threaded manner, that is, start a meeting to open a new thread, each meeting thread to maintain their own conference status, such as participants, speakers, save the history of the session information and empty the memory of the data and so on.

　　 Four, the client design

The meeting room client consists of two parts, one part is the management interface of the conference room, the main package conference room "Tim check" and "Start" or "Close" the conference service operation. This part of our direct use of easyjweb tools in the Add-and-check business engine abstractcrudaction can be quickly implemented. The interface is also relatively simple, directly using the Easyjweb Tools code generation tool engine to generate it. The client in the conference room management is a traditional Java web technology, so there is nothing to consider.

The second part of the client is also the main part of the meeting system, which has two main interfaces, the first page is the selection page of the meeting room entry. It also lists the conference rooms that have been started, and the user chooses a conference room to enter, which is also the use of traditional Java Web technology. The second page is the main interface to the meeting room, which is the main interface of the entire conference system, and all the operations involved in the meeting run here. This interface requires constant interaction with the server side of the data transmission, including the user's speech, other people to the user's speech, the status of the conference room and so on. Some transmission information requires an immediate response (such as a user speaking), and some information can be set to a timed response (e.g. conference room status).

There are two main ways to interact with server-side data in a Java Web program, one is to refresh the page directly, and the other is to use the socket to communicate directly with the Web server port. Because of the relatively complex socket programming, we choose the first way to directly refresh the page, this way can be divided into several, including the traditional form submission, traditional automatic refresh Web Access data and the use of ActiveXObject objects (such as XMLHTTP) directly interacting with the server data, That's the Ajax way. Because the use of Ajax means that users do not feel the page is refreshed, better than manual or automatic refresh of the page, so we decided to choose the Ajax way to implement the client and server side of the data interaction.

When users speak, use the XMLHTTP object to post data directly to the server. In order to be able to receive other people's speech information, the need to constantly read from the server side of the data, therefore, the need to start a timer at the client, every time the automatic use of XMLHTTP object to the server to download the speaker information, and display to the conference Room information main interface. In addition, the number of attendees, the current speaker in the Conference room, the Bulletin of the Conference room, and so on, can also be updated by starting a timer from the client and interacting with the server through the XMLHTTP object.

There are also a number of operations, lock conference rooms, kicking people, the designated speaker time, to the conference room password and other functions, but also through the XMLHTTP way with the server Transfer command.

　　 Five, the core code description

1, server-side core code

In the EASYJF open Source team meeting system, because is EASYJF official website forum system, the backstage management and so on is integrates together. The server Chatservice and chatroom are merged into a Chatservice.java class to achieve conference Room Management and conference service functions. Part of the main code for the Chatservice class is as follows:

Package com.easyjf.chat.business; public class Chatservice implements Runnable { private static final Map service=new HashMap ()//Conference Room service, the current meeting room in the system is stored in the table collection Maximum number of meeting rooms that private static final int maxservices=10;//can open at the same time private static final SimpleDateFormat df=new SimpleDateFormat ("Yyyy-mm-dd"); Private final List msgs;//chat information Chat Private final List users;//online user, Chatuser Private final List talkers;//number of speakers in line talker Private final List manager;//Conference Room Manager Private Talker currenttalker;//Current spokesperson Private String cid;//Room ID Private String title;//Conference Room topics Private String intro;//Conference Room Introduction Private String owner;//Meeting room creator private int maxuser;//Max online number private int interval;//Max refresh time interval Private String vrtype;//access rights Private String vrvalue;//Access value Private String announce; Private String password;//Room access password private int status;//Conference Room status Private String FilePath; private thread thread; Private Boolean isstop=false; Public Chatservice () { This.msgs=new ArrayList (); This.users=new ArrayList (); This.talkers=new ArrayList (); This.manager=new ArrayList (); this.maxuser=1000;//Max 1000 people at the same time THIS.INTERVAL=1000*60*5;//5 minutes before the information } /** * Stop All Conference rooms * */ public static void Clear () { if (!service.isempty ()) { Iterator It=service.values (). iterator (); while (It.hasnext ()) { Chatservice chat= (Chatservice) it.next (); Chat.stop (); } } Service.clear (); } /** * Create a conference Room * @param name Conference Room ID * @return */ public static Chatservice Create (String name) { Chatservice Ret=null; if (Service.containskey (name)) { Chatservice s= (Chatservice) service.get (name); S.stop (); Service.remove (name); } if (Service.size () { Ret=new Chatservice (); Service.put (Name,ret); } return ret; } /** * Stop a meeting room * @param name Conference Room ID * @return */ public static Boolean close (String name) { Chatservice chatroom=chatservice.get (name); if (chatroom!=null) { Chatroom.stop (); Service.remove (name); } return true; } /** * Get a conference room information * @param name Conference Room ID * @return */ public static Chatservice Get (String name) { if (Service.containskey (name)) return (Chatservice) service.get (name); else return null; } public void Run () { TODO auto-generated Method Stub This.thread=thread.currentthread (); while (!isstop) { SYSTEM.OUT.PRINTLN ("Start monitoring a conference room!") +this.title); This.flash (); try{ Thread.Sleep (5000); } catch (Exception e) { E.printstacktrace (); } } SYSTEM.OUT.PRINTLN ("End!"); } public void Stop () { This.flashall (); Isstop=true; } There are speakers in the Conference room public Boolean talk (Chat Chat) { Boolean ret=false; if (Cantalk (Chat.getsender ())) { This.msgs.add (chat); Ret=true; } return ret; } public boolean exit (Chatuser user) { Talk (Genesystemmsg user.getusername () + "quit the meeting room!" ")); return This.users.remove (user); } } Refresh information, save meeting information public void Flash () { Flashchatmsg (); Flashchatuser (); } }

2, the MVC processing part of the action code

In the EASYJF conferencing system, because using Easyjweb as the MVC framework, it is easier to handle Ajax, and here is the core action key code for the conference room system.

Package com.easyjf.chat.action; public class Chataction extends Abstractcmdaction { Private Chatservice chatroom; Public Object dobefore (WebForm form, module module) { TODO auto-generated Method Stub if (chatroom==null) Chatroom=chatservice.get ((String) form.get ("CID")); Return Super.dobefore (form, module); } Public Page doinit (WebForm form, module module) { TODO auto-generated Method Stub Return DoMain (Form,module); } User Login to the Conference room Public Page doMain (WebForm form, module module) { if (chatroom!=null) { Chatuser User=getchatuser (); if (!chatroom.join (user)) Form.addresult ("msg", "Can not join the room, may be insufficient permissions!") "); Form.addresult ("Chatroom", chatroom); Form.addresult ("user", user); } Else { Form.addresult ("MSG", "meeting not started" or the meeting room does not exist!) "); } Return Module.findpage ("main"); } Process User speaking Information Public Page dosend (WebForm form, module module) { if (Chatroom==null) return the new Page ("Err", "/err.html", "Thml"); returns no errors in the Conference room Chat chat= (Chat) Form.topo (Chat.class); Chat.setcid (Chatroom.geneid ()); Chatroom.talk (chat); Return dorecive (Form,module); } User receives speech information Public Page dorecive (WebForm form, module module) { if (Chatroom==null) return the new Page ("Err", "/err.html", "Thml"); returns no errors in the Conference room String lastreadid=commutil.null2string (Form.get ("Lastreadid")); System.out.println (Lastreadid); Form.addresult ("List", Chatroom.getnewestmsg (Getchatuser (), lastreadid)); Return Module.findpage ("Msglist"); } User refreshes meeting status information Public Page doloadconfig (WebForm form, module module) { if (Chatroom==null) return the new Page ("Err", "/err.html", "Thml"); returns no errors in the Conference room Form.addresult ("UserList", Chatroom.getusers ()); Form.addresult ("Talkerlist", Chatroom.gettalkers ()); return module.findpage ("config"); } User exits Public Page doexit (WebForm form, module module) { if (Chatroom==null) return the new Page ("Err", "/err.html", "Thml"); returns no errors in the Conference room Hatroom.exit (Getchatuser ()); Form.addresult ("MSG", "exit success"); Actioncontext.getcontext (). GetSession (). RemoveAttribute ("Chatuser"); return new Page ("MSG", "/chat/xmlmsg.xml", Globals.page_template_type); }

3, the client Ajax part of the core code

In the EASYJF conferencing system, the server sends to the client all the formatted XML document data. The following are the core AJAX functions and the client code that sends the information to receive the meeting.

function Newxmlhttprequest () { var xmlreq = false; if (window. XMLHttpRequest) { XMLreq = new XMLHttpRequest (); else if (window. ActiveXObject) { try { XMLreq = new ActiveXObject ("Msxml2.xmlhttp"); } catch (E1) { try { XMLreq = new ActiveXObject ("Microsoft.XMLHTTP"); } catch (E2) { } } } return xmlreq; } Processing return information XMLHTTP return value, Method: Methods name method must take a parameter such as dorecive (XNode); function Handleajaxresult (Req,method) { return function () { if (req.readystate = = 4) { if (Req.status = = 200) { Passing XML containing response information to a handler function var objxmldoc=new activexobject ("Microsoft.XMLDOM"); Objxmldoc.loadxml (Req.responsetext); Eval ("if (objxmldoc.firstchild)" +method+ "(objXMLDoc.firstChild.nextSibling);"); } else { Alert ("HTTP error:" +req.status); } } } } Execute client AJAX commands URL Data Post Address Packets Sent by PostData Handlemethod method of Processing returns function Executeajaxcommand (Url,postdata,handlemethod) { var req = Newxmlhttprequest (); Req.onreadystatechange =handleajaxresult (Req,handlemethod); Req.open ("PO ST", url, True); Req.setrequestheader ("Content-type", "application/x-www-form-urlencoded"); Req.setrequestheader ("CharSet", "Utf-8"); Req.send (PostData); } Users to speak Unction Dosend () { if (!check ()) return false; var Msg=editform.content.value; var Reciver=editform.reciver.value; var url= "/chat.ejf?easyjwebcommand=send&cid=" +roomid+ "&lastreadid=" +LASTREADID; var postdata= "sender=" +myname+ "&reciver=" +reciver+ "&content=" +MSG; Cleartimeout (Recivetime); Executeajaxcommand (Url,postdata, "recive"); Editform.content.value= ""; } Receive a speech message function dorecive () { var Reciver=editform.reciver.value; var url= "/chat.ejf?easyjwebcommand=recive&cid=" +roomid+ "&lastreadid=" +LASTREADID; Executeajaxcommand (URL, "", "recive"); } Handling received speech information function recive (list) { var id= ""; for (var onode=list.firstchild;onode;onode=onode.nextsibling)//parse each node sequentially { Chatcontent.innerhtml+=showmsg (Onode); Id=onode.getattribute ("CID"); } if (id!= "") Lastreadid=id; Chatcontent.scrolltop=chatcontent.scrollheight; Recivetime=settimeout ("dorecive ();", 5000); }

　　 VI. System Demo

You can go to EASYJF open Source team's official website to see the program demo effect, address is:

http://www.easyjf.com/chatRoom.ejf?easyJWebCommand=show&ejid=2538093638804337

　　 Concluding remarks

Ajax is technically primarily JavaScript, DHTML, CSS, XMLDOM, XMLHTTP, and some of the technologies we've come into contact with earlier. and XMLDOM and XMLHTTP also have nothing to write the program when the reference document opened copy on the ok,dhtml and JavaScript involved in more things, not just look at the reference document, you need to really digest, and flexible use, which requires everyone to practice. I suggest that you do not misuse Ajax. For experts to recommend more research on some business and system-level algorithm design, for beginners, the basic technology (client includes DHTML, CSS, JavaScript, XML, Java EE server-side design mode, UML modeling, Servlet, JDBC or ORM system, XML , EJB, and some frameworks, tools, etc. to learn is the hard truth.