- 浏览: 480910 次
- 性别:
- 来自: 广州
文章分类
- 全部博客 (502)
- Java (70)
- Linux (10)
- 数据库 (38)
- 网络 (10)
- WEB (13)
- JSP (4)
- 互联网 (71)
- JavaScript (30)
- Spring MVC (19)
- HTML (13)
- CSS (3)
- AngularJS (18)
- Redis (5)
- Bootstrap CSS (1)
- ZooKeeper (4)
- kafka (6)
- 服务器缓存 (4)
- Storm (1)
- MongoDB (9)
- Spring boot (16)
- log4j (2)
- maven (3)
- nginx (5)
- Tomcat (2)
- Eclipse (4)
- Swagger (2)
- Netty (5)
- Dubbo (1)
- Docker (7)
- Hadoop (12)
- OAuth (1)
- webSocket (4)
- 服务器性能 (7)
- Session共享 (1)
- tieye修改 (1)
- 工作 (1)
- 有用的语录 (0)
- https (2)
- common (5)
- 产品开发管理 (1)
- CDN 工作原理 (1)
- APNS、GCM (1)
- 架构图 (3)
- 功能实现分析 (1)
- JMX (1)
- 服务器相关操作命令 (1)
- img02 (0)
- 服务器环境搭建 (9)
- goodMenuBook (1)
- CEInstantPot (0)
- 有用数据 (1)
- 百度地图WEB API (2)
- 正则表达式 (1)
- 样式例子 (2)
- staticRecipePressureCooker.zip (1)
- jCanvas (1)
- 网站攻击方法原理 (1)
- 架构设计 (3)
- 物联网相关 (3)
- 研发管理 (7)
- 技术需求点 (1)
- 计划 (1)
- spring cloud (11)
- 服务器开发的一些实用工具和方法 (1)
- 每天学到的技术点 (4)
- Guava (1)
- ERP 技术注意要点 (2)
- 微信小程序 (1)
- FineRepor (1)
- 收藏夹 (1)
- temp (5)
- 服务架构 (4)
- 任职资格方案 (0)
- osno_test (1)
- jquery相关 (3)
- mybatis (4)
- ueditor (1)
- VueJS (7)
- python (10)
- Spring EL (1)
- shiro (1)
- 前端开发原理与使用 (7)
- YARN (1)
- Spark (1)
- Hbase (2)
- Pig (2)
- 机器学习 (30)
- matplotlib (1)
- OpenCV (17)
- Hystrix (1)
- 公司 (1)
- miniui (4)
- 前端功能实现 (3)
- 前端插件 (1)
- 钉钉开发 (2)
- Jenkins (1)
- elasticSearch使用 (2)
- 技术规范 (4)
- 技术实现原理 (0)
最新评论
WebSocket
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长连接的心跳包机制来进行连接状态的维护
websocket的优点
以前我们实现推送技术,用的都是轮询,在特点的时间间隔有浏览器自动发出请求,将服务器的消息主动的拉回来,在这种情况下,我们需要不断的向服务器
发送请求,然而HTTP request 的header是非常长的,里面包含的数据可能只是一个很小的值,这样会占用很多的带宽和服务器资源。会占用大量的带宽和服
务器资源。
例子:
HTML(客户端)
java(服务器)
//如果要从服务推送到WEB,就是要用MAP保存USE与chanle的对应关系
public void onOpen(Session session, @PathParam("ip") String ip)//传参数方式
goeasy//第三方方案
参考原文:https://www.web-tinker.com/article/20310.html
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长连接的心跳包机制来进行连接状态的维护
websocket的优点
以前我们实现推送技术,用的都是轮询,在特点的时间间隔有浏览器自动发出请求,将服务器的消息主动的拉回来,在这种情况下,我们需要不断的向服务器
发送请求,然而HTTP request 的header是非常长的,里面包含的数据可能只是一个很小的值,这样会占用很多的带宽和服务器资源。会占用大量的带宽和服
务器资源。
例子:
HTML(客户端)
<!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>
java(服务器)
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(); } }
//如果要从服务推送到WEB,就是要用MAP保存USE与chanle的对应关系
public void onOpen(Session session, @PathParam("ip") String ip)//传参数方式
goeasy//第三方方案
参考原文:https://www.web-tinker.com/article/20310.html
/** deviceDebugController.js */ angular.module("rideshare").controller("deviceDebugController", function ($scope) { //$scope.inputString = "123456345"; $scope.inputString = 10; var webSocket = new WebSocket('ws://ce5.midea.com:8080/mdot/logWebSocket'); webSocket.onerror = function (event) { onError(event) }; webSocket.onopen = function (event) { onOpen(event) }; webSocket.onmessage = function (event) { onMessage(event) }; function onMessage(event) { var stringorg = event.data; var myHtml = $scope.inputString; var re = new RegExp(myHtml, "gm"); stringorg = stringorg.replace(re, "<span style=\"background: #CCFF99; color:red; \">" + myHtml + "</span>"); $("#log-container div").append(stringorg); $scope.$apply(); $("#log-container").scrollTop($("#log-container div").height() - $("#log-container").height()); } function onOpen(event) { } function onError(event) { alert(event.data); } function start() { webSocket.send($scope.inputString); } function stopFn() { console.info("_C_L_O_S_E_"); webSocket.send("_C_L_O_S_E_"); } function cleanScreen() { $("#log-container div").empty(); } $scope.start = start; $scope.stopFn = stopFn; $scope.cleanScreen = cleanScreen; });
发表评论
-
选举算法
2022-06-17 08:48 384选举算法 常用的选举 ... -
elasticSearch使用
2022-04-27 08:42 342ElasticSearch 基于Apache Lucene构建 ... -
IDEA 快捷键
2022-03-02 16:55 215大小写转换快捷键 ctr+shift+u IDEA ... -
zookeeper dubbo 安装
2021-12-04 19:27 292docker-machine ssh default d ... -
将博客搬至CSDN
2021-11-18 19:57 164将博客搬至CSDN -
docker mysql 主从安装
2021-11-10 16:55 198docker run -d -p 13306:3306 --n ... -
rocketmq安装部署.txt
2021-11-07 19:10 183docker search rocketmq docke ... -
百度人脸识别
2021-05-21 16:11 332package com.gaojinsoft.htwy.y20 ... -
springBoot tomcat配置参数说明
2021-05-12 09:13 2941#最大连接数 server.tomcat.max-connec ... -
indexedDb TEST
2021-03-24 08:36 474<!DOCTYPE html> <html& ... -
技术选型
2021-01-29 17:34 2661.移动端组件vux,vant,vant好点,文档好的,基于v ... -
方便开发调试和问题跟踪
2021-01-01 10:17 2271.外网最好可以连接数据库 2.关键信息可以在接口返回信息, ... -
Jenkins脚本
2020-03-12 17:55 407#!/bin/bash -ilx echo "开始 ... -
test11223
2019-11-08 17:35 273nginx 的启动、停止与重 ... -
longKey
2019-12-05 17:23 257<!DOCTYPE html> <html ... -
base64与file 相互转换
2019-10-23 18:19 726base64与file 相互转换 import org. ... -
jQuery Validate 校验
2019-09-25 21:16 290https://www.runoob.com/jquery/j ... -
移动端调试神器
2019-09-23 22:55 241<!DOCTYPE html> <html ... -
钉钉开发
2019-09-17 20:16 405钉钉开发 开发者帐号 1357047443 x***310* ... -
textarea 特殊字符串处理
2019-07-04 22:56 1112<!DOCTYPE html> <html ...
相关推荐
基于WebAssembly和WebSocket的前端播放器 通过WebSocket协议,将视频流从回调函数取出通过Wasm解码在前端播放 WebSocket客户端文件夹是参考资料,可看可不看(感兴趣的可以瞅一眼)。 JSWebSocket文件夹中是完整的...
最近在开发小程序用到了WebSocket,小程序提供了相应的原生API,与H5的API使用方式上有一些区别,所以流行的H5的一些成熟的类库使用起来有些困难,而原生API又存在一些缺陷,所以就自己实现了一套心跳重连机制。...
赠送jar包:javax.websocket-api-1.1.jar; 赠送原API文档:javax.websocket-api-1.1-javadoc.jar; 赠送源代码:javax.websocket-api-1.1-sources.jar; 赠送Maven依赖信息文件:javax.websocket-api-1.1.pom; ...
赠送jar包:jakarta.websocket-api-1.1.2.jar; 赠送原API文档:jakarta.websocket-api-1.1.2-javadoc.jar; 赠送源代码:jakarta.websocket-api-1.1.2-sources.jar; 赠送Maven依赖信息文件:jakarta.websocket-api...
赠送jar包:websocket-api-9.4.11.v20180605.jar; 赠送原API文档:websocket-api-9.4.11.v20180605-javadoc.jar; 赠送源代码:websocket-api-9.4.11.v20180605-sources.jar; 赠送Maven依赖信息文件:websocket-...
赠送jar包:jakarta.websocket-api-1.1.2.jar; 赠送原API文档:jakarta.websocket-api-1.1.2-javadoc.jar; 赠送源代码:jakarta.websocket-api-1.1.2-sources.jar; 赠送Maven依赖信息文件:jakarta.websocket-api...
本篇博客介绍微信小程序中webSocket的使用方法,以及如何用局部网络建立webSocket连接,进行客户端与服务器之间的对话: webSocket简介 微信小程序端API调用 服务器端使用nodejs配置 演示websocket webSocket...
可用于 websocket接口测试! Jmeter的WebSocket协议支持插件: JMeterWebSocketSampler-1.0.2-SNAPSHOT.jar 所需依赖包: 1、jetty-http-9.1.2.v20140210.jar 2、jetty-io-9.1.2.v20140210.jar 3、jetty-util-9.1.2....
websocket
Java开发基于SpringBoot+WebSocket+Redis分布式即时通讯群聊系统。一个基于Spring Boot + WebSocket + Redis,可快速开发的分布式即时通讯群聊系统。适用于直播间聊天、游戏内聊天、客服聊天等临时性群聊场景。 ...
实战Spring Cloud的WebSocket体现此项目是一个WebSocket实施的实践,基于Spring Cloud。原理我们利用一致性哈希算法,构造一个哈希环,网关监听WebSocket服务实例的上下线消息,根据实例的变化动态地更新哈希环。将...
基于Vertx实现的websocket消息服务,支持集群部署。 启动步骤 mvn package 修改default-zookeeper.json自定义zookeeper地址。 修改default-websocket.json自定义websocket服务配置,包括: serverCode:服务名称 ...
WebSocket for Delphi
1、前端页面 ... 2、javascript websocket.js,websocket页面使用javascript...WebSocketServer.java、WebSocketConfig.java 定义后台onopen、onmessage、onclose、onerror函数及信息发送函数,提供给websoceket功能支持。
let ws = new WebSocket('wss://echo.websocket.org/'); 然后是通过回调函数获取服务器消息以及对连接状态进行捕捉。 // 成功连接时触发 ws.onopen = () => { console.log('连接成功.'); this.send('{event:...
5WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。...
首先,我需要用到node的nodejs-websocket模块 使用yarn进行安装 yarn add nodejs-websocket –save 当然,你也可以用npm进行安装 npm i nodejs-websocket –save 安装完毕之后,我们开始写服务端的代码,首先,...
基于SuperSocket的服务器 和 客户端程序 所需要的...只需要引用 WebSocket4Net -------------------------- 本人菜鸟一枚,抛砖引入,欢迎一起来研究这个Socket开发框架 QQ:2360450496 SuperSocket官方QQ群373076764
Uniapp作为近来最火的移动端开发技术,一套代码,可以打包成Android/iOS app和各种平台的小程序,可谓是没有最方便只有更方便。 GoEasy上架DCloud Uniapp...Uniapp官方的websocket API主要是用来与您的websocket服务
Android 实现WebSocket长连接 最近项目中引入了实时接收服务器数据的功能,考量后通过WebSocket长链接来实现。 1、建立在 TCP 协议之上,服务器端的实现比较容易。 2、与 HTTP 协议有着良好的兼容性。默认端口也是80...