CometD：Java Web應用程序的Facebook類似聊天

聊天就像吃一塊蛋糕或喝一杯熱咖啡一樣容易。您是否曾經考慮過自己開發聊天程序？您知道，聊天不容易。但是，如果您是開發人員，并且閱讀了本文的結尾，則可以嘗試自己開發一個聊天應用程序，并允許您的用戶通過您的Web應用程序進行聊天。我的網絡應用程序。就像每個人一樣，我開始在互聯網上搜索。我找到了IRC。當我閱讀并搜索有關IRC的更多信息時，我了解到很難為IRC找到基于Web的客戶端。我想擁有更多可定制的Web客戶端，其工作方式類似于Facebook。最后，幸運的是，我找到了CometD。

最后，我能夠使用CometD和在瀏覽器中打開的與Facebook完全相似的可自定義的聊天窗口來實現聊天應用程序。這幾乎適用于所有現代瀏覽器。本文分步說明了如何從頭開始實現聊天應用程序，以及如何將聊天應用程序集成到您現有的Java基本Web應用程序。記住，您的Web應用程序應該是基于Java的應用程序。

您需要從他們的官方網站下載cometD 。它具有實現聊天應用程序所需的所有依賴關系，除了兩個Java腳本庫。我已經編寫了兩個Javascript庫，一個用于創建動態聊天窗口（如Facebook），另一個用于以通用方式處理CometD聊天功能。如果您可以自己管理這些內容，則無需使用這些Javascript庫。實際上，CometD文檔提供了很多詳細信息。但是，我將通過使用這些拖曳庫繼續進行本教程。無論如何，我建議您先使用這些拖曳庫，然后根據需要對其進行自定義。我希望與您共享該示例應用程序，您可以將其部署在本地主機中并測試其工作方式。

1.添加所需的jar文件。

如果您使用maven來構建項目，則將以下依賴項添加到pom.xml文件中

<dependencies><dependency><groupId>org.cometd.java</groupId><artifactId>bayeux-api</artifactId><version>2.5.0</version></dependency><dependency><groupId>org.cometd.java</groupId><artifactId>cometd-java-server</artifactId><version>2.5.0</version></dependency><dependency><groupId>org.cometd.java</groupId><artifactId>cometd-websocket-jetty</artifactId><version>2.5.0</version><exclusions><exclusion><groupId>org.cometd.java</groupId><artifactId>cometd-java-client</artifactId></exclusion></exclusions></dependency><dependency><groupId>org.slf4j</groupId><artifactId>slf4j-simple</artifactId><version>1.6.6</version></dependency><dependency><groupId>org.cometd.java</groupId><artifactId>cometd-java-annotations</artifactId><version>2.5.0</version></dependency>
</dependencies>

如果您不使用maven來構建項目，則只需將以下.jar文件從CometD下載包中復制到/ WEB-INF / lib文件夾中即可。您可以從/cometd-demo/target/cometd-demo-2.5.0.war文件中找到這些.jar文件。

bayeux-api-2.5.0.jar
cometd-java-annotations-2.5.0.jar
cometd-java-common-2.5.0.jar
cometd-java-server-2.5.0.jar
cometd-websocket-jetty-2.5.0.jar
javax.inject-1.jar
jetty-continuation-7.6.7.v20120910.jar
jetty-http-7.6.7.v20120910.jar
jetty-io-7.6.7.v20120910.jar
jetty-jmx-7.6.7.v20120910.jar
jetty-util-7.6.7.v20120910.jar
jetty-websocket-7.6.7.v20120910.jar
jsr250-api-1.0.jar
slf4j-api-1.6.6.jar
slf4j-simple-1.6.6.jar

2.添加所需的Javascript文件。

您需要鏈接以下Javascript文件。

cometd.js
AckExtension.js
ReloadExtension.js
jQuery的1.8.2.js
jquery.cookie.js
jquery.cometd.js
jquery.cometd-reload.js
chat.window.js
comet.chat.js

“ chat.window.js ”和“ comet.chat.js ”是我自己的兩個Javascript庫，但不包含CometD發行版。如果您完全遵循本教程，則還必須鏈接這些拖車庫。提供的示例應用程序具有以下兩個Javascript庫。

3.編寫聊天服務類。

/*** @author Semika siriwardana* CometD chat service.*/
package com.semika.cometd;import java.util.HashMap;
import java.util.Map;
import java.util.Set;
import java.util.concurrent.ConcurrentHashMap;
import java.util.concurrent.ConcurrentMap;import javax.inject.Inject;import org.cometd.annotation.Configure;
import org.cometd.annotation.Listener;
import org.cometd.annotation.Service;
import org.cometd.annotation.Session;
import org.cometd.bayeux.client.ClientSessionChannel;
import org.cometd.bayeux.server.BayeuxServer;
import org.cometd.bayeux.server.ConfigurableServerChannel;
import org.cometd.bayeux.server.ServerMessage;
import org.cometd.bayeux.server.ServerSession;
import org.cometd.server.authorizer.GrantAuthorizer;
import org.cometd.server.filter.DataFilter;
import org.cometd.server.filter.DataFilterMessageListener;
import org.cometd.server.filter.JSONDataFilter;
import org.cometd.server.filter.NoMarkupFilter;@Service('chat')
public class ChatService {private final ConcurrentMap<String, Map<String, String>> _members = new ConcurrentHashMap<String, Map<String, String>>();@Injectprivate BayeuxServer _bayeux;@Sessionprivate ServerSession _session;@Configure ({'/chat/**','/members/**'})protected void configureChatStarStar(ConfigurableServerChannel channel) {DataFilterMessageListener noMarkup = new DataFilterMessageListener(new NoMarkupFilter(),new BadWordFilter());channel.addListener(noMarkup);channel.addAuthorizer(GrantAuthorizer.GRANT_ALL);}@Configure ('/service/members')protected void configureMembers(ConfigurableServerChannel channel) {channel.addAuthorizer(GrantAuthorizer.GRANT_PUBLISH);channel.setPersistent(true);}@Listener('/service/members')public void handleMembership(ServerSession client, ServerMessage message) {Map<String, Object> data = message.getDataAsMap();final String room = ((String)data.get('room')).substring('/chat/'.length());Map<String, String> roomMembers = _members.get(room);if (roomMembers == null) {Map<String, String> new_room = new ConcurrentHashMap<String, String>();roomMembers = _members.putIfAbsent(room, new_room);if (roomMembers == null) roomMembers = new_room;}final Map<String, String> members = roomMembers;String userName = (String)data.get('user');members.put(userName, client.getId());client.addListener(new ServerSession.RemoveListener() {public void removed(ServerSession session, boolean timeout) {members.values().remove(session.getId());broadcastMembers(room, members.keySet());}});broadcastMembers(room, members.keySet());}private void broadcastMembers(String room, Set<String> members) {// Broadcast the new members listClientSessionChannel channel = _session.getLocalSession().getChannel('/members/'+room);channel.publish(members);}@Configure ('/service/privatechat')protected void configurePrivateChat(ConfigurableServerChannel channel) {DataFilterMessageListener noMarkup = new DataFilterMessageListener(new NoMarkupFilter(),new BadWordFilter());channel.setPersistent(true);channel.addListener(noMarkup);channel.addAuthorizer(GrantAuthorizer.GRANT_PUBLISH);}@Listener('/service/privatechat')protected void privateChat(ServerSession client, ServerMessage message) {Map<String,Object> data = message.getDataAsMap();String room = ((String)data.get('room')).substring('/chat/'.length());Map<String, String> membersMap = _members.get(room);if (membersMap == null) {Map<String,String>new_room=new ConcurrentHashMap<String, String>();membersMap=_members.putIfAbsent(room,new_room);if (membersMap==null)membersMap=new_room;}String peerName = (String)data.get('peer');String peerId = membersMap.get(peerName);if (peerId != null) {ServerSession peer = _bayeux.getSession(peerId);if (peer != null) {Map<String, Object> chat = new HashMap<String, Object>();String text = (String)data.get('chat');chat.put('chat', text);chat.put('user', data.get('user'));chat.put('scope', 'private');chat.put('peer', peerName);ServerMessage.Mutable forward = _bayeux.newMessage();forward.setChannel('/chat/' + room);forward.setId(message.getId());forward.setData(chat);if (text.lastIndexOf('lazy') > 0) {forward.setLazy(true);}if (peer != client) {peer.deliver(_session, forward);}client.deliver(_session, forward);}}}class BadWordFilter extends JSONDataFilter {@Overrideprotected Object filterString(String string) {if (string.indexOf('dang') >= 0) {throw new DataFilter.Abort();}return string;}}
}

4.更改web.xml文件。

您應該將以下過濾器添加到web.xml文件中。

<filter><filter-name>continuation</filter-name><filter-class>org.eclipse.jetty.continuation.ContinuationFilter</filter-class>
</filter>
<filter-mapping><filter-name>continuation</filter-name><url-pattern>/cometd/*</url-pattern>
</filter-mapping>

還有以下servlet。

<servlet><servlet-name>cometd</servlet-name><servlet-class>org.cometd.annotation.AnnotationCometdServlet</servlet-class><init-param><param-name>timeout</param-name><param-value>20000</param-value></init-param><init-param><param-name>interval</param-name><param-value>0</param-value></init-param><init-param><param-name>maxInterval</param-name><param-value>10000</param-value></init-param><init-param><param-name>maxLazyTimeout</param-name><param-value>5000</param-value></init-param><init-param><param-name>long-polling.multiSessionInterval</param-name><param-value>2000</param-value></init-param><init-param><param-name>logLevel</param-name><param-value>0</param-value></init-param><init-param><param-name>transports</param-name><param-value>org.cometd.websocket.server.WebSocketTransport</param-value></init-param><init-param><param-name>services</param-name><param-value>com.semika.cometd.ChatService</param-value></init-param><load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping><servlet-name>cometd</servlet-name><url-pattern>/cometd/*</url-pattern>
</servlet-mapping>

5.實現客戶端功能。

我認為這部分應該是描述性的。如果允許用戶與其他用戶聊天，則需要在網頁中顯示在線用戶列表，就像Facebook在右側欄中顯示在線用戶一樣。為此，您可以在頁面內放置一個簡單的<span>或<div>標記。我做了如下。

<div id='members'></div>

所有的在線用戶將顯示在上述容器中。單擊特定的用戶名后，它將打開一個類似于Facebook的新聊天窗口。對于每對用戶，它將打開一個新的聊天窗口。要獲得這種行為，您應該使用我之前提到的“ chat.window.js ”。特定用戶對之間的聊天將通過專用的聊天窗口繼續進行。
用戶以通常的方式登錄到您的Web應用程序后，我們應該為該用戶訂閱聊天頻道。您可以使用以下方式進行操作。

$(document).ready(function(){ $.cometChat.onLoad({memberListContainerID:'members'});
});

請注意，我已將在線用戶列表容器的“ id”作為配置參數傳遞。然后，用戶應按以下方式加入頻道。您可以使用用戶名調用波紋管方法。

function join(userName){$.cometChat.join(userName);
}

由于對于每個聊天，都有一個像Facebook一樣的專用聊天窗口，因此我們應該維護全局Javascript數組來存儲那些創建的聊天窗口對象。您需要在頁面內放置以下Javascript代碼。

function getChatWindowByUserPair(loginUserName, peerUserName) {var chatWindow;  for(var i = 0; i < chatWindowArray.length; i++) {var windowInfo = chatWindowArray[i];if (windowInfo.loginUserName == loginUserName && windowInfo.peerUserName == peerUserName) {chatWindow =  windowInfo.windowObj;}}return chatWindow;
}function createWindow(loginUserName, peerUserName) {  var chatWindow = getChatWindowByUserPair(loginUserName, peerUserName);if (chatWindow == null) { //Not chat window created before for this user pair.chatWindow = new ChatWindow(); //Create new chat window.chatWindow.initWindow({loginUserName:loginUserName, peerUserName:peerUserName,windowArray:chatWindowArray});//collect all chat windows opended so far.var chatWindowInfo = { peerUserName:peerUserName, loginUserName:loginUserName,windowObj:chatWindow };chatWindowArray.push(chatWindowInfo);}chatWindow.show();  return chatWindow;
}

如上所述，聲明以下全局Javascript變量。

var chatWindowArray = [];   
var config = {contextPath: '${pageContext.request.contextPath}'
};

由于我使用的是JSP頁面，因此必須通過“ pageContext ”變量獲取上下文路徑。如果您使用的是HTML頁面，請自行進行管理以聲明“ config” Javascript全局變量。現在，您幾乎到達了教程的最后一部分。

5.示例應用程序如何工作？

您可以下載comet.war文件并將其部署在服務器中。將瀏覽器指向以下URL。

http：// localhost：8080 / comet

這將帶您進入一個包含文本字段和名為“ Join”的按鈕的頁面。根據需要插入一些用戶名，然后單擊“加入”按鈕。然后，您將轉到另一個包含在線用戶列表的頁面。您的姓名以紅色突出顯示。要在本地計算機上聊天，您可以打開另一個瀏覽器（IE和FF）并加入聊天頻道。對等用戶在聯機用戶列表中以藍色顯示。單擊對等用戶后，它將打開一個新的聊天窗口，以便您可以與他聊天。此功能與Facebook聊天非常相似。

我已經在IE，FF和Crome中測試了此聊天應用程序，并且工作正常。如果您需要將其與Java基本Web應用程序集成的任何幫助，請給我發送郵件。