文档章节

基于Tomcat运行HTML5 WebSocket echo实例详解

张睿知
 张睿知
发布于 2015/11/20 18:51
字数 1096
阅读 76
收藏 0
 一、概述

 

  作为HTML5新特性之一的WebSocket组件,在实时性有一定要求的WEB应用开 发中还是有一定用武之地,高版本的IE、Chrome、FF浏览器都支持Websocket,标准的Websocket通信是基于RFC6455实现服务 器端与客户端握手与消息接发的。如果对Websocket通信不是太理解,可以查看RFC文档即可,简单说就是通过发送HTTP请求,实现双方握手,将无 状态的HTTP通信协议进一步升级成有状态的通信协议,同时Websocket还支持子协议选项与安全传输。标准的websocket连接URL以ws开 头,如果是基于TLS的则以wss开头。基于Websocket可以很方便的开发基于web聊天程序,各种网页消息通知与推送通知。

 

  如果非要扒一扒Websocket的今生前世的话,还记得最早的基于HTTP轮询实现网页即时通信的方式,那种 做法比较消耗资源、于是有人改进了编程CometD长连接方式,可是本质上还是换汤不换药,而websocket的出现正好解决了这些问题,但是很多浏览 器的低版本还是不支持websocket,于是还催生了一些基于websocket理念实现的JS通信框架,其中学得比较像的有SockJS与 socket.io,他们都号称支持websocket,然后如果浏览器端不支持原生的websocket,它们会自动启用fallback选项使用其它 诸如ajax、Http轮询、长轮询/连接、甚至是flash的socket等机制实现模拟websocket的工作方式,但是他们最大的弊端是如果客户 端使用了这些框架,服务器必须用它们,否则等待开发者就是一大堆无法回避的问题,同时很多都是无解的。主要原因在于它们实现自己的协议集,不照它们的格式 处理数据没法玩。闲话说的有点多。


二、实现步骤

 

  Tomcat7的高版本中实现了Websocket服务器端RFC6455标准协议,可以跟浏览器端websocket进行通信,首先要做好如下几步:

 

  1.安装高版本JDK – JDK8

  2.安装Tomcat 7.0.64

  3.在eclipse中建立一个动态的web项目

 

  根据JSR标准,Java中实现websocket的标准接口可以基于注解方式,tomcat也搞好了,只有我们实现如下代码,即可创建一个websocket回声服务器:

package com.websocket.demo;  
   
import java.io.IOException;  
import java.nio.ByteBuffer;  
   
import javax.websocket.OnMessage;  
import javax.websocket.OnOpen;  
import javax.websocket.Session;  
import javax.websocket.server.ServerEndpoint;  
   
@ServerEndpoint(value = "/echo")  
public class EchoExample {  
       
    @OnMessage  
    public void echoTextMessage(Session session, String msg, boolean last) {  
        try {  
            if (session.isOpen()) {  
                System.out.println("received from client message = " + msg);  
                session.getBasicRemote().sendText(msg, last);  
            }  
        } catch (IOException e) {  
            try {  
                session.close();  
            } catch (IOException e1) {  
            }  
        }  
    }  
       
    @OnOpen  
    public void openConn(Session session) throws IOException {  
        session.getBasicRemote().sendText("hello web socket"); // means open it  
    }  
       
    @OnMessage  
    public void echoBinaryMessage(Session session, ByteBuffer bb, boolean last) {  
        System.out.println("send binary message...");  
        try {  
            if (session.isOpen()) {  
                System.out.println("byte buffer lenghth : " + bb.array().length);  
                System.out.println("byte buffer content: " + ((bb.array()[0]) & 0xff));  
                System.out.println("byte buffer content: " + ((bb.array()[1]) & 0xff));  
                System.out.println("byte buffer content: " + ((bb.array()[2]) & 0xff));  
                session.getBasicRemote().sendBinary(bb, last);  
            }  
        } catch (IOException e) {  
            try {  
                session.close();  
            } catch (IOException e1) {  
                // Ignore  
            }  
        }  
    }  
   
}

 如何在tomcat中启动websocket服务器,首先需要在web.xml添加如下配置:

[listener]  
    [listener-class]org.apache.tomcat.websocket.server.WsContextListener[/listener-class]  
[/listener]

然后实现ServerApplicationConfig接口,实现如下:

http://www.html5cn.org/data/attachment/portal/201511/05/115755wz0rb0200a4zdisd.jpg

 创建网页echo.html,内容如下:

[html] 
[head] 
[title>Web Socket Echo Test[/title] 
[script] 
        var ws = null;  
        var count = 0;  
        function setConnected(connected) {  
            document.getElementById('connect').disabled = connected;  
            document.getElementById('disconnect').disabled = !connected;  
            document.getElementById('echo').disabled  = !connected;  
        }  
   
        function connect() {  
            var target = document.getElementById('target').value;  
            if (target == '') {  
                alert('Please select server side connection implementation.');  
                return;  
            }  
   
            if ('WebSocket' in window) {  
                ws = new WebSocket(target);  
            } else if ('MozWebSocket' in window) {  
                ws = new MozWebSocket(target);  
            } else {  
                alert('WebSocket is not supported by this browser.');  
                return;  
            }  
               
            ws.onopen = function () {  
                setConnected(true);  
                log('Info: WebSocket connection opened.');  
            };  
            ws.onmessage = function (event) {  
                log('Received: ' + event.data);



本文转载自:http://www.html5cn.org/article-8988-1.html

张睿知
粉丝 2
博文 3
码字总数 672
作品 0
昆明
私信 提问
加载中

评论(1)

w
wahahachuang4
我觉得这种东西自己开发太麻烦了,就别自己捣鼓了,找个第三方,方便,GoEasy就挺不错的,我昨天试了一下,代码简洁易懂,几分钟我就洗了一个自己的实时推送功能;官网: http://goeasy.io/
八问WebSocket协议:为你快速解答WebSocket热门疑问

本文由“小姐姐养的狗”原创发布于“小姐姐味道”公众号,原题《WebSocket协议 8 问》,收录时有优化和改动。感谢原作者的分享。 一、引言 WebSocket是一种比较新的协议,它是伴随着html5规范...

JackJiang2011
04/25
0
0
HTML5 WebSocket JavaWeb 实现简单的聊天室功能

本实例使用websocket实现了即时聊天系统,websocket技术可以在网页中使用js技术完成与后台的通讯, 而后台tomcat集成了websocket功能, 只需要很少的代码就可以完成很强大的功能, 基于此聊天系...

智慧点点
2018/04/23
321
0
spring websocket 和socketjs实现单聊群聊,广播的消息推送详解

spring websocket 和socketjs实现单聊群聊,广播的消息推送详解 WebSocket简单介绍 随着互联网的发展,传统的HTTP协议已经很难满足Web应用日益复杂的需求了。近年来,随着HTML5的诞生,WebSo...

浅色夏墨
2018/08/17
0
0
八问WebSocket协议:为你快速解答WebSocket热门疑问

一、引言 WebSocket是一种比较新的协议,它是伴随着html5规范而生的,虽然还比较年轻,但大多主流浏览器都已经支持。它使用方面、应用广泛,已经渗透到前后端开发的各种场景中。 对http一问一...

首席大胸器
04/25
133
0
Web端即时通讯技术盘点:短轮询、Comet、Websocket、SSE

1. 前言 Web端即时通讯技术因受限于浏览器的设计限制,一直以来实现起来并不容易,主流的Web端即时通讯方案大致有4种:传统Ajax短轮询、Comet技术、WebSocket技术、SSE(Server-sent Events)...

JackJiang-
2016/07/14
2.1K
4

没有更多内容

加载失败,请刷新页面

加载更多

聊聊rocketmq的adjustThreadPoolNumsThreshold

序 本文主要研究一下rocketmq的adjustThreadPoolNumsThreshold DefaultMQPushConsumer rocketmq-client-4.5.2-sources.jar!/org/apache/rocketmq/client/consumer/DefaultMQPushConsumer.ja......

go4it
18分钟前
8
0
关于早起

早起是非常好的事情,但是像如果前一天睡得晚,或者第二天早上是非常冷的时候,那就不是很美好了。 但是本身早起是一件非常棒的事情,我记得我每次早起 如果不觉得困的话,世界是那么安静,脑...

T型人才追梦者
45分钟前
7
0
Java输入输出

JDK中的InputStream/OutputStream构成了IO输入输出继承层次的基础。它们都是面向字节序列的,每次可以从序列中读入或者写出一个字节或者指定大小的字节数组。但是面向字节流的输入输出不便于...

ytuan996
今天
5
0
Xamarin图表开发基础教程(9)OxyPlot框架

Xamarin图表开发基础教程(9)OxyPlot框架 OxyPlot组件构成 OxyPlot组件主要由两个类构成,分别为PlotView和PlotModel。这两个类我们在上文中也使用到了。本节将讲解介绍这两个类。 1.图表视...

大学霸
今天
5
0
协议栈

一、关键技术点分析 不同服务在性能上适用不同协议进行传输,如对接异构第三方服务时,通常选择HTTP/Restful等公有协议;而对于内部不同模块之间的服务调用,一般选择性能较高的二进制私有协...

edwardGe
今天
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部