【WebSocket】手把手教会使用WebSocket

由于参加了黑客马拉松,团队需要这个技术,所以我下午就简单的实现了一下。找了好多demo,最大问题就是环境大家都没介绍清楚,我弄了很久很久的环境。

首先eclipse得是j2ee的,eclipse官网或者私信给我我发给你吧(如果你确实不会下)

另外一个就是tomcat,这个必须是7以上的版本在支持j2ee的websocket包。apache-tomcat-7.0.72-windows-x64.zip

再就是eclipse配jdk,一定要1.7以上,不会配也可以私信我。

这个都弄完之后环境就搭好了,在eclipse建一个server。

目录结构

WebSocketTest.java

package com.hust.websockettest;

import java.io.IOException;

import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;

@ServerEndpoint("/websocket")
public class WebSocketTest {

    @OnMessage
    public void onMessage(String message, Session session) throws IOException, InterruptedException {

        // Print the client message for testing purposes
        System.out.println("Received: " + message);

        // Send the first message to the client
        session.getBasicRemote().sendText("This is the first server message");

        // Send 3 messages to the client every 5 seconds
        int sentMessages = 0;
        while (sentMessages < 3) {
            Thread.sleep(5000);
            session.getBasicRemote().sendText("This is an intermediate server message. Count: " + sentMessages);
            sentMessages++;
        }

        // Send a final message to the client
        session.getBasicRemote().sendText("This is the last server message");
    }

    @OnOpen
    public void onOpen() {
        System.out.println("Client connected");
    }

    @OnClose
    public void onClose() {
        System.out.println("Connection closed");
    }
}

index.html

<!DOCTYPE html>
<html>
<head>
<title>Testing websockets</title>
</head>
<body>
    <div>
        <input type="submit" value="Start" onclick="start()" />
    </div>
    <div id="messages"></div>
    <script type="text/javascript">
        var webSocket = new WebSocket(
                'ws://localhost:8080/WebSocketTest/websocket');

        webSocket.onerror = function(event) {
            onError(event)
        };

        webSocket.onopen = function(event) {
            onOpen(event)
        };

        webSocket.onmessage = function(event) {
            onMessage(event)
        };

        function onMessage(event) {
            document.getElementById('messages').innerHTML += '<br />'
                    + event.data;
        }

        function onOpen(event) {
            document.getElementById('messages').innerHTML = 'Connection established';
        }

        function onError(event) {
            alert(event.data);
        }

        function start() {
            webSocket.send('hello');
            return false;
        }
    </script>
</body>
</html>

运行截图

WebSockets 握手
客户端和服务器端TCP连接建立在HTTP协议握手发生之后。通过HTTP流量调试,很容易观察到握手。客户端一创建一个 WebSocket实例,就会出现如下请求和服务器端响应:
注意: 我们只录入了WebSocket握手所用到的HTTP头。
请求:
GET /WebSocketTest/websocket HTTP/1.1
Connection: Upgrade
Upgrade: websocket
Sec-WebSocket-Key: wVlUJ/tu9g6EBZEh51iDvQ==
响应:
HTTP/1.1 101 Web Socket Protocol Handshake
Upgrade: websocket
Sec-WebSocket-Accept: 2TNh+0h5gTX019lci6mnvS66PSY=
注意:进行连接需要将通过Upgrade and Upgrade将协议升级到支持websocket HTTP头的Websocket协议。服务器响应表明请求被接受,协议将转换到WebSocket协议(HTTP状态码101):
HTTP/1.1 101 Web Socket Protocol Handshake

时间: 2024-09-20 09:42:36

【WebSocket】手把手教会使用WebSocket的相关文章

WebSocket 实战之——【WebSocket 原理】

一.WebSocket是什么? HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接的(长连接,循环连接的不算).         首先HTTP有1.1和1.0之说,也就是所谓的keep-alive,把多个HTTP请求合并为一个,但是Websocket其实是一个新协议,跟HTTP协议基本没有关系,只是为了兼容现有浏览器的握手规范而已,也就是说它是HTTP协议上的一种补充可以通过这样一张图理解 &amp;amp;amp;amp;amp;amp;amp;

手把手教会你建立VPN专线

  经常出差的朋友,对于VPN网络应该并不陌生,因为接入VPN网络后,无论身在何处都可以随时通过互联网,来远程接入企业内部网络,访问企业内部数据.而随着我国"宽带中国"战略的深入推广,光纤入户逐步落地,家庭的网络应用也开始变得越发丰富多彩,一些朋友也想拥有方便的VPN专线,来随时访问家庭网络中的资源内容.那么VPN网络该怎样搭建呢?下面就来了解下吧. 架设VPN服务器 VPN是Virtual Private Network,虚拟专用网络的英文缩写,此前一般多应用于企业中,是企业内部网的

手把手教会你如何通过C#创建Windows Service

本文转载:http://www.cnblogs.com/xiurui12345/archive/2012/05/16/2503868.html Windows Service这一块并不复杂,但是注意事项太多了,网上资料也很凌乱,偶尔自己写也会丢三落四的.所以本文也就产生了,本文不会写复杂的东西,完全以基础应用的需求来写,所以不会对Windows Service写很深入. 本文介绍了如何用C#创建.安装.启动.监控.卸载简单的Windows Service 的内容步骤和注意事项. 一.创建一个Wi

江礼坤谈策划网站 手把手教会你起步

"市场推广宝典"这个系列的文章,写了有六.七篇了,期间很多人加了笔者的群,在里面讨论各种网站运营与推广方面的问题,笔者很是欣慰,感谢大家的信任和支持.在交流中笔者发现,大家把市场推广看的太重了,其实市场推广仅仅是市场运营的一部分,对于市场推广来说,平台是基础,内容是关键.所以推广之前,一定先要把网站建设好,内容做强.特别是对于新站,前期的策划很重要.今天江礼坤就来和大家说一说关于网站策划的事.注意,本文主要是给大家一个思路,并不涉及写策划方案或是http://www.aliyun.co

为什么我们需要HTML5 WebSocket

HTML5 WebSocket简介     HTML5作为下一代的 Web 标准,它拥有许多引人注目的新特性,如 Canvas.本地存储.多媒体编程接口.WebSocket等等.这其中有"Web 的 TCP "之称的WebSocket格外吸引开发人员的注意.WebSocket的出现使得浏览器提供对Socket的支持成为可能,从而在浏览器和服务器之间提供了一个基于TCP连接的双向通道.Web开发人员可以非常方便地使用WebSocket构建实时web应用,开发人员的手中从此又多了一柄神兵利

html5利用websocket完成的推送功能(tomcat)

插播一条消息,5天后会删掉的 本人东北大学软件学院大三学生,现在正在寻找实习,qq:1021842556 利用websocket和java完成的消息推送功能,服务器用的是tomcat7.0,一些东西是自己琢磨的,也不知道恰不恰当,不恰当处,还请各位见谅,并指出. 程序简单来说,就是客户A可以发送消息给客户B,但有很多可以扩展的地方, 比如 1.如果加入数据库后,A发消息时客户B未上线,服务端将会把消息存在数据库中,等客户B上线后,在将消息取出发送给客户B 2.服务端也可发送消息到任意客户端上.

.NET的WebSocket开发包比较

本文出现在第三方产品评论部分中.在这一部分的文章只提供给会员,不允许工具供应商用来以任何方式和形式来促销或宣传产品.请会员报告任何垃圾信息或广告. Web项目常常需要将数据尽可能快地推送给客户,必要时无需等待客户端请求.对于与用户之间进行实时通信的网站,例如在线交流或文档协作工具,或者在长期运行的计算/执行任务的服务器上更新系统状态,等等这些时候,采用双向沟通机制是理想的. 以前,这类问题一般使用下面的解决方案: 使用 Flash 中的 Socket 连接(http://help.adobe.c

Windows 8 Store Apps学习(63) 通信: WebSocket

介绍 重新想象 Windows 8 Store Apps 之 通信 Socket - 与 WebSocket 服务端做 Text 通信 Socket - 与 WebSocket 服务端做 Stream(Binary) 通信 示例 WebSocket 的服务端 WebServer/WebSocketServer.ashx.cs /* * WebSocket 协议的服务端 * * 需要在 iis 启用 WebSocket 协议:控制面板 -> 程序和功能 -> 启用或关闭 Windows 功能 -

带你认识HTML5中的WebSocket

 认识 HTML5 的 WebSocket 在 HTML5 规范中,我最喜欢的Web技术就是正迅速变得流行的 WebSocket API.WebSocket 提供了一个受欢迎的技术,以替代我们过去几年一直在用的Ajax技术.这个新的API提供了一个方法,从客户端使用简单的语法有效地推动消息到服务器.让我们看一看 HTML5 的 WebSocket API:它可用于客户端.服务器端.而且有一个优秀的第三方API,名为Socket.IO. 一.HTML5 中的 WebSocket API 是个什么东