HTML5体验:基于Jetty8的WebSocket聊天Demo

 

在看WebSocket,相关的一些服务器的支持情况大概是:

Tomcat目前还不支持WebSocket,

Jetty7开始支持WebSocket,

JBoss的Netty需要插件后可以支持WebSocket,

Node.js可以配合node-websocket-server一起使用来运行WebSocket ( https://github.com/miksago/node-websocket-server)

 

 

这里参考Jetty8里面的原有的Demo,修改整理出来一份能够独立运行的WebSocket示例。

需要做的工作大概如下

 

1. 下载Jetty8

版本: jetty-hightide-8.0.0.M2  ,
地址: http://dist.codehaus.org/jetty/jetty-hightide-8.0.0.M2/

 

2. Eclipse创建一个动态的Web工程,把Jetty8的Run

 

3. 编写 WebSocketServlet代码 WebSocketChatServlet.java

 

4. 在web.xml中配置servlet

 

5. 编写Web页面 ws/index.html

 

6. 导出war文件 Jetty8WebSocket.war, 放到jetty的webapps目录下

 

7. 启动jetty8

   jetty-hightide-8.0.0.M2 admin$ java -jar start.jar

 

8. 打开Chrome浏览器,我用的是Chrome11

浏览器中输入http://localhost:8080/Jetty8WebSocket/ws/

可以聊天了。

 

效果是这样纸滴:

 

 

下面直接贴代码

 

File:  WebSocketChatServlet.java

==============================================================

package com.acme;

import java.io.IOException;
import java.util.Set;
import java.util.concurrent.CopyOnWriteArraySet;

import javax.servlet.RequestDispatcher;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.eclipse.jetty.io.Connection;
import org.eclipse.jetty.util.TypeUtil;
import org.eclipse.jetty.util.log.Log;
import org.eclipse.jetty.websocket.WebSocket;
import org.eclipse.jetty.websocket.WebSocket.Outbound;
import org.eclipse.jetty.websocket.WebSocketServlet;

 
public class WebSocketChatServlet extends WebSocketServlet
{
    private final Set _members = new CopyOnWriteArraySet();
   
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
        throws javax.servlet.ServletException ,IOException
    {
        getServletContext().getNamedDispatcher("default").forward(request,response);
    };
   
    public WebSocket doWebSocketConnect(HttpServletRequest request, String protocol)
    {
        return new ChatWebSocket();
    }
   
   
    class ChatWebSocket implements WebSocket
    {
        Outbound _outbound;
   

        @Override
        public void onConnect(Outbound outbound) {
             _outbound = outbound;
             _members.add(this);
        }

        @Override
        public void onDisconnect() {
             _members.remove(this);
        }

        @Override
        public void onMessage(byte frame, String data) {
             for(ChatWebSocket member : _members)
             {
                 try{
                     member._outbound.sendMessage(frame,data);
                 }catch(IOException e){
                     Log.warn(e);
                 }
             }
        }

        @Override
        public void onMessage(byte arg0, byte[] arg1, int arg2, int arg3) {
            
        }

        @Override
        public void onFragment(boolean arg0, byte arg1, byte[] arg2, int arg3,
                int arg4) {
             
           
        }
       
    }
   
   
}
===================================================================

 

File: index.html


    WebSocket Chat
   
   



 

    Username: 
   
   
 

 




This is a demonstration of the Jetty websocket server.



       
       
       
======================================

 

File: web.xml 中的Servlet配置

===============================

 
    WSChat
    com.acme.WebSocketChatServlet
    1
 

 
    WSChat
    /ws/*
 

======================================

 

如果想下载完整的工程,可以去这里找:

https://github.com/lixinso/html5/tree/master/workspace/Jetty8WebSocket

 

大家有关于HTML5或者其它Web开发相关的技术问题,欢迎一起讨论交流。

我的Email: lixinso[at]gmail[dot]com

blog: blog.csdn.net/lixinso

微博:weibo.com/lixinso

 

 

这里是相关的一些参考资料:

 

http://dev.w3.org/html5/websockets/

 

Introduction to use Jetty WebSocket Server
http://blogs.webtide.com/gregw/entry/jetty_websocket_server

Jetty源代码,可以找到一些示例:
svn co http://dev.eclipse.org/svnroot/rt/org.eclipse.jetty/jetty/branches/jetty-8
test-jetty-webapp/src/main/webapp/ws/index.html

Jetty Wiki:
http://wiki.eclipse.org/Jetty

Using Jetty with Eclipse
http://wiki.eclipse.org/Jetty/HowTo/Using_Jetty_with_Eclipse

 

Eclipse插件 jetty-wtp: For Jetty 7 & 8
http://download.eclipse.org/jetty/updates/jetty-wtp/development

 

你可能感兴趣的:(HTML5体验:基于Jetty8的WebSocket聊天Demo)