html5tcp协议,HTML5基于TCP的全双⼯通信协议WebSocket 我们从⼩就在学习分享,我们分享过糖果、分享过玩具,今天我们⼀起分享知识。
webSocket
1.websocket背景简介
2.websocket的客户端使⽤⽅式
3.websocket服务端使⽤⽅式
1.websocket背景介绍
HTTP和WebSocket两者的差距不⼤
浏览⽹页时,经过三个过程
1、浏览器经过三次握⼿与web服务器建⽴链接,
2、web服务器返回响应
3、浏览器通过四次握⼿主动断开链接
因为第三步导致不能持久链接,那我们去掉第三步不就可以了实现持久链接了吗?这就是WebSocket与HTTP最⼤的不同(Web服务器是不会主动断开连接的),当然还有更多的数据封装格式的不同。 可以看到WebSocket是在HTTP上做的改动,有⼈曾经⽤单⽚机的TCP/IP协议栈封装符合HTTP协议格式的字符串,去连接Web服务器。WebSocket和HTML5没有多⼤关系。
如果要搭建⼀个Web服务器,我们会有很多选择,市场上也有很多成熟的产品供我们应⽤,⽐如开源的Apache,安装后只需简单的配置(或者默认配置)就可以⼯作了。但是如果想搭建⼀个WebSocket服务器就没有那么轻松了,因为WebSocket是⼀种新的通信协议,⽬前还是草案,没有成为标准,市场上也没有成熟的WebSocket服务器或者Library实现WebSocket协议,我们就必须⾃⼰动⼿写代码去解析和组装WebSocket的数据包。要这样完成⼀个WebSocket服务器,估计所有的⼈都想放弃,幸好的是市场上有⼏款⽐较好的开源库供我们使⽤,我们可以调⽤这些接⼝,这在很⼤程度上减少了我们的⼯作量。
百万websocket常连接的服务器
Netty服务器
Spray服务器
node.js
Websocket协议之握⼿连接
⼀、协议包含两个部分,第⼀个是“握⼿”,第⼆个是数据传输。
ws://127.0.0.1:8080 //不太安全
wss://127.0.0.1:8080 //更安全
类似于http https的区别
⼆、握⼿(Opening > Closing Handshake)打开连接
1、发送握⼿请求
2、返回握⼿应答
3、错误处理 所有数据传输都是UTF-8编码的数据,当⼀端接收到的字节流数据不是⼀个有效的UTF-8数据流,那么接收到的这⼀⽅必须要马上关闭连接。这个规则在开始握⼿⼀直到所有的数据交换过程都要进⾏验证。
2.websocket的客户端使⽤⽅式
浏览器通过 JavaScript 向服务器发出建⽴ WebSocket 连接的请求,连接建⽴以后,客户端和服务器端就可以通过 TCP 连接直接交换数据。
那么简⾔之⽤户所使⽤的浏览器就看作为客户端(client)那么我们需要在html中利⽤Javascript去创建我们的客户端由于是html5提供的WebSocket服务那么现在主流的浏览器都可以直接使⽤WebSocket。(ie8+均可使⽤)
书归正传
WebSocket 属性
以下是 WebSocket 对象的属性。假定我们使⽤了以上代码创建了 Socket 对象:
属性adyState
只读属性 readyState 表⽰连接状态,可以是以下值:
0 - 表⽰连接尚未建⽴。
1 - 表⽰连接已建⽴,可以进⾏通信。
2 - 表⽰连接正在进⾏关闭。
3 - 表⽰连接已经关闭或者连接不能打开。
Socket.bufferedAmount
只读属性 bufferedAmount 已被 send() 放⼊正在队列中等待传输,但是还没有发出的 UTF-8 ⽂本字节数。WebSocket 事件
以下是 WebSocket 对象的相关事件。假定我们使⽤了以上代码创建了 Socket 对象:
事件    事件处理程序              描述
open    pen  连接建⽴时触发
ssage    客户端接收服务端数据时触发
error  r  通信发⽣错误时触发
close  lose  连接关闭时触发
WebSocket ⽅法
以下是 WebSocket 对象的相关⽅法。假定我们使⽤了以上代码创建了 Socket 对象:
⽅法  描述
Socket.send()
使⽤连接发送数据
Socket.close()
关闭连接
1.需要先创建WebSocket 并且判断⼀下当前浏览器是否⽀持
var websocket = null;
//判断当前浏览器是否⽀持WebSocket
if ('WebSocket' in window) {
websocket = new WebSocket("ws://localhost:8080/webSocket/websocket");
} else {
alert('当前浏览器 Not support websocket')
}
创建成功后利⽤WebSocket提供的⽅法去实现WebSocket的服务
//连接发⽣错误的回调⽅法
setMessageInnerHTML("WebSocket连接发⽣错误");
};
//连接成功建⽴的回调⽅法
setMessageInnerHTML("WebSocket连接成功");
}
//接收到消息的回调⽅法
setMessageInnerHTML(event.data);
}
//连接关闭的回调⽅法
setMessageInnerHTML("WebSocket连接关闭");
}
//监听窗⼝关闭事件,当窗⼝关闭时,主动去关闭websocket连接,防⽌连接还没断开就关闭窗⼝,server端会抛异常。beforeunload = function() {
closeWebSocket();
}
//将消息显⽰在⽹页上
function setMessageInnerHTML(innerHTML) {
';
}
//关闭WebSocket连接
function closeWebSocket() {
websocket.close();
}
//发送消息
function send() {
var message = ElementById('text').value;
websocket.send(message);
}
3.websocket服务端使⽤⽅式
那么根据对客户端的理解,java中的servlet也就是我们服务端,处理业务逻辑的地⽅
需要注意
因为使⽤websocket与传统的http请求是不同的那么在servlet就与之前学习过的有很⼤的不同
不同⼀ 注解不同
以前我们访问⼀个servlet使⽤的是@WebServlet("/login.do")如果换成websocket⽅式需要改成@ServerEndpoint("/websocket")
不同⼆ ⽅法不同
我们不在需要doGet(),doPost()这个两个⽅法了。因为webSocket是⼀种新的协议与传统http不同(前⽂提到过)/**
* @ServerEndpoint 注解是⼀个类层次的注解,它的功能主要是将⽬前的类定义成⼀
* 个websocket服务器端,
* 注解的值将被⽤于监听⽤户连接的终端访问URL地址,客户端可以通过这个URL来连接
* 到WebSocket服务器端
*/
@ServerEndpoint("/websocket")
public class WebSocket {
// 静态变量,⽤来记录当前在线连接数。应该把它设计成线程安全的。
private static int onlineCount;
/
/ concurrent包的线程安全Set,⽤来存放每个客户端对应的MyWebSocket对象。若要实现服务端与单⼀客户端通信的话,可以使⽤Map来存放,
//其中Key可以为⽤户标识
private static CopyOnWriteArraySet webSocketSet = new CopyOnWriteArraySet();
// 与某个客户端的连接会话,需要通过它来给客户端发送数据
private Session session;
/**
* 连接建⽴成功调⽤的⽅法
* @param session
*  可选的参数。session为与某个客户端的连接会话,
websocket和socket
*  需要通过它来给客户端发送数据
*/
@OnOpen
public void onOpen(Session session) {
this.session = session;
webSocketSet.add(this); // 加⼊set中
addOnlineCount(); // 在线数加
System.out.println("有新连接加⼊!当前在线⼈数为" + getOnlineCount()); }
/**
* 连接关闭调⽤的⽅法
*/
@OnClose
public void onClose() {
subOnlineCount(); // 在线数减
System.out.println("有⼀连接关闭!当前在线⼈数为" + getOnlineCount()); }
/**
* 收到客户端消息后调⽤的⽅法
* @param message
* 客户端发送过来的消息
* @param session
* 可选的参数
*/
@OnMessage
public void onMessage(String message, Session session) {
System.out.println("来⾃客户端的消息:" + message);
// 发消息
for (WebSocket item : webSocketSet) {
try {
item.sendMessage(message);
} catch (IOException e) {
e.printStackTrace();
continue;
}
}
}
/**

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。