java实现WebSocket即时通信

序:JSR 356:Java API for WebSocket是javaee7新推出来的一个新的特性,他相对于其它容器实现,优点是他是一个标准.容器的更新都会遵守这个标准.不需要更改代码.减少后期的维护工作量.webscoket主要的作用是用来双向即时通信.对比传统的实现可以减少很多不必要的开销.但是对IE浏览器的支持就不太好了.所以如果客户群主要是IE而且是低版本的.使用该技术就要慎重了.

参考资料:

http://www.oschina.net/translate/how-to-build-java-websocket-applications-using-the-jsr-356-api 翻译文章

http://porridge.qiniudn.com/ppt%E4%BD%BF%E7%94%A8_JSR_356_%E5%9C%A8_Java_%E4%B8%AD%E6%9E%84%E5%BB%BA_WebSocket_%E5%BA%94%E7%94%A8.pptx PPT下载

对浏览器的支持情况:


了解以上信息过后准备开始实现一个WEBSOCKET的DEMO.

准备工具:

tomcat7+

jdk7+ (webscoket是javaee7的新特性,所以必须版本是7及以上.)


创建工程:

创建一个名为webscoket的工程.

java文件如下:

01 package org.temp;
02  
03 import java.io.IOException;
04 import java.util.Hashtable;
05 import java.util.Map;
06 import java.util.Set;
07 import java.util.logging.Logger;
08  
09 import javax.websocket.CloseReason;
10 import javax.websocket.CloseReason.CloseCodes;
11 import javax.websocket.OnClose;
12 import javax.websocket.OnError;
13 import javax.websocket.OnMessage;
14 import javax.websocket.OnOpen;
15 import javax.websocket.RemoteEndpoint;
16 import javax.websocket.Session;
17 import javax.websocket.server.PathParam;
18 import javax.websocket.server.ServerEndpoint;
19 //注意此访问地址格式如:"ws://"+ window.location.host+"/${pageContext.request.contextPath}/game"是ws开头的,而不是以http:开头的.
20 @ServerEndpoint(value = "/game")
21 public class Scoket {
22  
23     private Logger logger = Logger.getLogger(this.getClass().getName());
24  
25     static Map<String,Session> sessionMap = new Hashtable<String,Session>();
26      
27     @OnOpen
28     public void onOpen(Session session) {
29         sessionMap.put(session.getId(), session);
30     }
31  
32     @OnMessage
33     public void onMessage(String unscrambledWord, Session session) {
34         broadcastAll("message",unscrambledWord);
35     }
36     /**
37      * 广播给所有人
38      * @param message
39      */
40     public static void broadcastAll(String type,String message){
41         Set<Map.Entry<String,Session>> set = sessionMap.entrySet();
42         for(Map.Entry<String,Session> i: set){
43             try {
44                 i.getValue().getBasicRemote().sendText("{type:'"+type+"',text:'"+message+"'}");
45             catch (Exception e) {
46                 e.printStackTrace();
47             }
48         }
49     }
50  
51     @OnClose
52     public void onClose(Session session, CloseReason closeReason) {
53         sessionMap.remove(session.getId());
54         logger.info(String.format("Session %s closed because of %s", session.getId(), closeReason));
55     }
56      
57     @OnError
58     public void error(Session session, java.lang.Throwable throwable){
59         sessionMap.remove(session.getId());
60         System.err.println("session "+session.getId()+" error:"+throwable);
61     }
62 }


创建一个注解为:@ServerEndpoint的webscoket的服务端.供前台访问.因为想实现点其它功能.所以在广播给所有人这个方法里边加上了type以备区分

注解说明图:


接下来是jsp页面.直接上代码..

01 <%@ page language="java" contentType="text/html; charset=UTF-8"
02     pageEncoding="UTF-8"%>
03 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
04 <html>
05 <head>
06 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
07 <title>Insert title here</title>
08 <script src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
09 <script type="text/javascript">
10 var socket =null;
11 $(function(){
12     function parseObj(strData){//转换对象
13         return (new Function( "return " + strData ))();
14     };
15     //创建socket对象
16     socket = new WebSocket("ws://"+ window.location.host+"/${pageContext.request.contextPath}/game");
17     //连接创建后调用
18     socket.onopen = function() {
19         $("#showMsg").append("连接成功...<br/>");
20     };
21     //接收到服务器消息后调用
22     socket.onmessage = function(message) {
23         var data=parseObj(message.data);
24         if(data.type=="message"){
25             $("#showMsg").append("<span style='display:block'>"+data.text+"</span>");
26         }else if(data.type=="background"){
27             $("#showMsg").append("<span style='display:block'>系统改变背景地址,背景地址是:"+data.text+"</span>");
28             $("body").css("background","url("+data.text+")");
29         }
30     };
31     //关闭连接的时候调用
32     socket.onclose = function(){
33         alert("close");
34     };
35     //出错时调用
36     socket.onerror = function() {
37         alert("error");
38     };
39     $("#sendButton").click(function() {
40         socket.send($("#msg").val());
41     });
42     $("#abcde").click(function(){
43         $.post("${pageContext.request.contextPath}/backgroundimg");
44     });
45 });
46 </script>
47 </head>
48 <body>
49     <div id="showMsg" style="border: 1px solid; width: 500px; height: 400px; overflow: auto;"></div>
50     <div>
51         <input type="text" id="msg" /> 
52         <input type="button" id="sendButton" value="发送" />
53         <input type="button" value="改变背景" id="abcde" />
54     </div>
55 </body>
56 </html>

基本上就可以简单的实现了多人聊天功能了.或者集体换背景图片功能.

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值