WebSocket

最新推荐文章于 2023-11-17 17:20:12 发布

jie310600

最新推荐文章于 2023-11-17 17:20:12 发布

阅读量105

点赞数

分类专栏： WEB 互联网 webSocket 文章标签： WebSocket

互联网同时被 3 个专栏收录

36 篇文章 0 订阅

订阅专栏

WEB

7 篇文章 0 订阅

订阅专栏

webSocket

4 篇文章 0 订阅

订阅专栏

[b]WebSocket[/b]

1.WebSocket protocol 是HTML5一种新的协议。它是实现了浏览器与服务器全双工通信(full-duplex)。HTML5定义了WebSocket协议，
能更好的节省服务器资源和带宽并达到实时通讯。
2.WebSocket是为解决客户端与服务端实时通信而产生的技术。其本质是先通过HTTP/HTTPS协议进行握手后创建一个用于交换数据的TCP连接，
此后服务端与客户端通过此TCP连接进行实时通信。
3.借用了HTTP的协议来完成一部分握手。在HTTP1.1中进行了改进，使得有一个keep-alive，也就是说，在一个HTTP连接中，可以发送多个Request，接收多个Response。
4.Websocket服务器端程序运行结束就会发出关闭事件给前端
5.长连接可能是基于类似于socket长连接的心跳包机制来进行连接状态的维护

[b]websocket的优点[/b]
以前我们实现推送技术，用的都是轮询，在特点的时间间隔有浏览器自动发出请求，将服务器的消息主动的拉回来，在这种情况下，我们需要不断的向服务器
发送请求，然而HTTP request 的header是非常长的，里面包含的数据可能只是一个很小的值，这样会占用很多的带宽和服务器资源。会占用大量的带宽和服
务器资源。

[b]例子：[/b]
[b]HTML(客户端)[/b]

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>websocketTest</title>
</head>
<body>
<div>
    <input type="button" value="connect" onclick="connectfn()"/>
</div>
<div>
    <input type="button" value="Start" onclick="start()"/>
</div>
<div>
    <input type="button" value="close" onclick="closefn()"/>
</div>
<div id="messages"></div>
<script type="text/javascript">
    var webSocket =
            new WebSocket('ws://127.0.0.1:8080/CESmart/WebSocketTest');

    //产生异常
    webSocket.onerror = function (event) {
        onError(event)
    };

    //已经建立连接
    webSocket.onopen = function (event) {
        onOpen(event)
    };

    //收到服务器消息，使用evt.data提取
    webSocket.onmessage = function (event) {
        onMessage(event)
    };

    //已经关闭连接
    webSocket.onclose = function (event) {
        alert("onclose");
        webSocket.close();
    };

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

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

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

    function start() {
        alert("start");
        webSocket.send('hello');
        //return false;
    }

    function closefn() {
        alert("close");
        webSocket.send('close');
        webSocket.close();
        webSocket = null;
    }
    function connectfn() {
        alert("connectfn");
        if (webSocket == null) {
            alert("webSocket == null");
            webSocket =
                    new WebSocket('ws://127.0.0.1:8080/CESmart/WebSocketTest');
//收到服务器消息，使用evt.data提取
            webSocket.onmessage = function (event) {
                alert("onmessage");
                onMessage(event)
            };
        }
    }

    window.onbeforeunload = function () {
        alert("onbeforeunload");
        webSocket.send('close'); //发送关闭请求让服务器关闭链接
        webSocket.close();//关闭TCP连接
        webSocket = null;
        return false; // 可以阻止关闭
    }
</script>
</body>
</html>

[b]java(服务器)[/b]

package com.proserver.common.controller.WebSocket;

import java.io.IOException;

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

@ServerEndpoint("/WebSocketTest") // 这里表示定义WebSocket的接入点
public class WebSocketTest {
	// 接收消息处理
	@OnMessage
	public void onMessage(Session session, String message) {
		System.out.println("webSocket onMessage message == " + message);
		if (session != null) {
			try {
				session.getBasicRemote().sendText("Server Test!<br>");
			} catch (IOException e) {
				e.printStackTrace();
			}
		} else {
			System.out.println("this.session == null");
		}

		if (message.equals("close")) {
			System.out.println("this.session message == close");
			try {
				session.close();// 关闭连接
			} catch (IOException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			}
		}

	}

	// 新的WebSocket请求开启
	@OnOpen
	public void onOpen(Session session) {
		System.out.println("webSocket onOpen");
	}

	// WebSocket请求关闭
	@OnClose
	public void onClose(Session session) {
		System.out.println("webSocket onClose");
		if (session != null) {
			try {
				session.close();
			} catch (IOException e) {
				e.printStackTrace();
			}
		}
	}

	// WebSocket出错
	@OnError
	public void onError(Throwable thr) {
		System.out.println("onError");
		thr.printStackTrace();
	}
}