HTML5 WebSocket

1 介绍:

WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。

在WebSocket API中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以通过 TCP 连接直接交换数据。

当你获取 Web Socket 连接后,你可以通过 send() 方法来向服务器发送数据,并通过 onmessage 事件来接收服务器返回的数据。

以下 API 用于创建 WebSocket 对象。

代码实例:

var Socket = new WebSocket(url, [protocol] );

以上代码中的第一个参数 url, 指定连接的 URL。第二个参数 protocol 是可选的,指定了可接受的子协议。

2 WebSocket 属性

2.1 Socket.readyState

      只读属性 readyState 表示连接状态,可以是以下值:

  • 0 - 表示连接尚未建立。

  • 1 - 表示连接已建立,可以进行通信。

  • 2 - 表示连接正在进行关闭。

  • 3 - 表示连接已经关闭或者连接不能打开。

2.2 Socket.bufferedAmount
  只读属性 bufferedAmount 已被 send() 放入正在队列中等待传输,但是还没有发出的 UTF-8 文本字节数。
  

3 WebSocket 对象的相关事件:在建立ocket 对象后:

open Socket.onopen 连接建立时触发
message Socket.onmessage 客户端接收服务端数据时触发
error Socket.onerror 通信发生错误时触发
close Socket.onclose 连接关闭时触发

4 WebSocket 对象的相关方法:在建立ocket 对象后:

Socket.send()
使用连接发送数据
Socket.close()
关闭连接

5 WebSocket 实例

WebSocket 协议本质上是一个基于 TCP 的协议。

为了建立一个 WebSocket 连接,客户端浏览器首先要向服务器发起一个 HTTP 请求,这个请求和通常的 HTTP 请求不同,包含了一些附加头信息,其中附加头信息"Upgrade: WebSocket"表明这是一个申请协议升级的 HTTP 请求,服务器端解析这些附加的头信息然后产生应答信息返回给客户端,客户端和服务器端的 WebSocket 连接就建立起来了,双方就可以通过这个连接通道自由的传递信息,并且这个连接会持续存在直到客户端或者服务器端的某一方主动的关闭连接。

css总结20:TCP通信协议WebSocket的更多相关文章

  1. TCP/IP, WebSocket 和 MQTT

    按照OSI网络分层模型,IP是网络层协议,TCP是传输层协议,而HTTP和MQTT是应用层的协议.在这三者之间, TCP是HTTP和MQTT底层的协议.大家对HTTP很熟悉,这里简要介绍下MQTT.M ...

  2. TCP/IP WebSocket MQTT

    http://www.cnblogs.com/shanyou/p/4085802.html TCP/IP, WebSocket 和 MQTT

  3. (29)网络编程之TCP通信协议

    TCP通信协议特点: 1.tcp协议是基于IO流进行数据的传输,是面向链接的. 2.tcp进行数据传输的时候,数据没有大小限制的. 3.面向链接,通过三次握手的机制,保证数据的完整性,是一个可靠的协议 ...

  4. Modbus RTU通信协议详解以及与Modbus TCP通信协议之间的区别和联系

    Modbus通信协议由Modicon公司(现已经为施耐德公司并购,成为其旗下的子品牌)于1979年发明的,是全球最早用于工业现场的总线规约.由于其免费公开发行,使用该协议的厂家无需缴纳任何费用,Mod ...

  5. PHP workerMan tcp与webSocket 透传互通

    <?php $work_path = dirname(__FILE__); chdir($work_path); use \Workerman\Worker; use \Workerman\Li ...

  6. netty同端口监听tcp和websocket协议

    前言: 软件通信七层结构(osi模型)中由协议套协议最终组成最高级应用层协议(http等等),下三层结构偏向与数据通信,上三层更偏向于数据处理,中间的传输层则是连接上三层与下三层之间的桥梁,每一层都做 ...

  7. 分布式架构基石-TCP通信协议

    为什么会有TCP/IP协议 在世界上各地,各种各样的电脑运行着各自不同的操作系统为大家服务,这些电脑在表达同一种信息的时候所使用的方法是千差万别.就好像圣经中上帝打乱了各地人的口音,让他们无法合作一样 ...

  8. 基于ROS和python,通过TCP通信协议,完成键盘无线控制移动机器人运动

    一.所需工具包 1.ROS键盘包:teleop_twist_keyboard 2.TCP通讯包:socket $ cd ~/catkin_ws/src $ git clone https://gith ...

  9. 4 CSS的20/80个知识点

    1.css的基本构成 样式选择器 id选择器 元素选择器 2.css的盒模型 border padding margin 3.Atom快捷键 4.程序 (1)初始程序 <!DOCTYPE htm ...

随机推荐

  1. Ubantu 新建用户后没有生成对应文件夹

    原命令:useradd python 改正后:useradd python -m 后成功在home目录下创建文件夹 原因: man useradd就可以看到如此介绍:Create the user´s ...

  2. F4NNIU 学习目录 (2018-08-22)

    F4NNIU 学习目录 语言 C 语言 C 语言程序设计进阶 在线刷题 https://leetcode-cn.com/problemset/all/ 工具 Git 版本管理 在线教程 在线教程

  3. Android三种左右滑动效果 手势识别(转)

    本示例演示在Android中实现带渐显按钮的左右滑动效果. 关于滑动效果,在我的上一篇博文中提到过,有兴趣的朋友可以访问: http://www.cnblogs.com/hanyonglu/archi ...

  4. 一键获取 所有连接过的WIFI密码

    使用方法 一.运行CMD (以及 开启无线网卡.最好是笔记本) 二.输入命令: for /f "skip=9 tokens=1,2 delims=:" %i in ('netsh ...

  5. 搭建JIRA汉化后乱码问题

    JIRA的简体中文乱码(使用了BIG5导致) 安装完JIRA汉化后发现一部分中文显示乱码,经检查:本来应该是UTF-8编码的却显示成Big5,Big5根本不支持简体中文的! 进入JIRA数据库后找到 ...

  6. Python3 的urllib实例

    在Python3中合并了 urllib 和 urllib2, 统一命名为 urllib 了,我觉得这样更加合理了.让我们可以像读取本地文件一样读取WEB上的数据.封装了一个类,供以后方便使用吧!并附带 ...

  7. Java-Runoob:Java 对象和类

    ylbtech-Java-Runoob:Java 对象和类 1.返回顶部 1. Java 对象和类 Java作为一种面向对象语言.支持以下基本概念: 多态 继承 封装 抽象 类 对象 实例 方法 重载 ...

  8. Spring XML和Annotation混合配置的时候,XML中Bean名称写错会导致启动异常不打印、死循环

    今天做Tomcat迁移Spring Boot,遇到一个坑.启动没有错误,CPU特别高 经过把堆栈kill -3 打印出来,发现堆栈特别长(没有死循环),所有的堆栈信息都集中在org.springfra ...

  9. ubuntu安装composer

    1.下载composer.phar wget https://getcomposer.org/composer.phar 2.重命名composer.phar为composer mv composer ...

  10. 在工作表左侧中添加TreeView控件

    开发环境基于VSTO:visual studio 2010,VB .Net,excel 2007,文档级别的定制程序. 需求是在sheet的左侧停靠System.Windows.Forms.TreeV ...