eclipse和tomcat8的websocket入门篇

[更新]：下面图片看不了 真是对不住大家   

可参考源地址http://blog.sina.com.cn/s/blog_6b92dce10101jc24.html
还有问题请留言 

最近笔者在做websocket的调研，本来以为很快就可以写一个demo出来，没想到一拖再拖，这么久了才写出一个demo。在网上找了很多例子，但是总觉得没说清楚。有的例子还很老了，是关于tomcat7的，但是tomcat7关于websocket的有些包已经启用，无法使之编译通过。还有的例子是关于jetty之类的其他服务器，由于tomcat使用比较广泛，所以在此笔者只调研了tomcat8的demo。我就这么迷茫的乱窜，经过两三周的努力，终于成功写出一个demo了。由于websocket还算比较新，用的不广泛，所以网上相关资料不多，而且都是点到为止，感觉那些写的人自己都不是很明白，在此找到我这篇文章的人你们有福了，我会很详细的给大家写这个入门篇，希望你们看完之后可以成功写出一个demo，并成功运行。

   首先，关于websocket的什么协议啊，具体API啊，在此我不赘述，我就当你们对websocket有一定的了解了，想动手写一个demo了。

我的运行环境是：

eclipse：

Eclipse Java EE IDE for Web Developers.

Version: Kepler Service Release 1

Build id: 20130919-0819

apache-tomcat-8.0.5.tar.gz

    这个地方千万注意了，我用的这个版本eclipse不支持tomcat8，最多支持到tomcat7。怎么办呢？可能你会说我可以直接用tomcat8里面的startup.bat，将要测试的工程打包到webapp，可是那样太麻烦，而且比较费时，笔者当时就是这么做的，结果还老遇到闪退的情况，根本没法查错。纠结死了。后来无意中发现一个简单解决办法。

     下载一个WTP文件：http://www.eclipse.org/downloads/download.php?file=/webtools/downloads/drops/R3.6.0/I-3.6.0-20140213154746/wtp4x-I-3.6.0-20140213154746.zip

然后将里面的feature和plugin文件夹拷贝到eclipse里面，覆盖掉。再重启eclipse，你就可以安装tomcat8服务器了

    第二步：解压tomcat8,安装tomcat8服务器，这个不用我仔细教了吧，大家自己去查别处怎么做了啊。

    现在环境设置好了，我们接下来讲如何写一个demo了。

    

   解压后的tomcat8，打开如下目录：\apache-tomcat-8.0.5\webapps\examples，META-INF和index.html先不用管他们，没太大用处。把websocket整个文件拷贝到新建的项目的webcontent下。在打开这个目录\apache-tomcat-8.0.5\webapps\examples\WEB-INF\classes\websocket，把这个websocket和util文件拷贝到项目的src文件。废话不多说了，看图吧！笔者只做了echo和chat两个例子，所以在这里只讲这两个例子。如图：

   导进去会报错，是因为找不到有些包，鼠标停在项目上，右击，build path->configure build path->add external jars,将tomcat8里面的tomcat-juli.jar和websocket-api.jar导入，报错解决。

第三步：这个地方很重要了，因为路径不对的话，出不来结果的。在chat.xhtml里，

找到这段代码：把examples改为你自己的项目名称，我的项目名称叫做webtest，所以改为：

 if (window.location.protocol == 'http:') {

                Chat.connect('ws://' + window.location.host + '/webtest/websocket/chat');

            } else {

                Chat.connect('wss://' + window.location.host + '/webtest/websocket/chat');

            }

     

  好了，完事了。运行结果：

看完上面你可能会有些疑问，因为这个程序只有java代码和xhtml代码，没有其他的诸如web.xml文件的配置。是的，这个就是tomcat8的websocket强大的地方，更方便，更简单。不用配置web.xml文件的原因是：我们来看看 ChatAnnotation类

、

这里有个@ServerEndpoint,@ServerEndpoint 注解是一个类层次的注解，它的功能主要是将目前的类定义成一个websocket服务器端。注解的值将被用于监听用户连接的终端访问URL地址。正是因为这个的存在，所以我们可以不用web.xml配置。

  xhtml和java代码对应起来是要看这个的：

  chat例子java代码段：

@ServerEndpoint(value = "/websocket/chat")

xhtml代码段：if (window.location.protocol == 'http:') {

                Chat.connect('ws://' + window.location.host + '/webtest/websocket/chat');

            } else {

                Chat.connect('wss://' + window.location.host + '/webtest/websocket/chat');

            }

  echo例子java代码段：

@ServerEndpoint("/websocket/echoAnnotation")

xhtml代码段：if (window.location.protocol == 'http:') {

                document.getElementByIdx_x('target').value = 'ws://' + window.location.host + target;

            } else {

                document.getElementByIdx_x('target').value = 'wss://' + window.location.host + target;

            }