WebSocket使用之API
来源:互联网 发布:什么营销软件最好 编辑:程序博客网 时间:2024/05/22 04:36
WebSocket API
Internet Explorer 10 和使用 JavaScript 的 Windows 应用商店应用引入了对 WebSocket API 的支持,其定义位于万维网联盟 (W3C) 的 WebSocket API 规范中。WebSockets 技术为通过 Internet 进行的双向通信提供了一个新的 W3C JavaScript API 和协议。这个新协议更便于直接处理固定数据格式,它会绕过速度较慢的基于文档的 HTTP 协议。
当前的 HTTP 标准协议很慢,因为它必须从服务器请求文档而且必须等待该文档发送,才能显示网页。使用 WebSocket,你可以使用文本、二进制数组或 BLOB 立即发送和接收你的数据。
WebSocket API 非常简单,它只需非常少的代码。你可以方便地利用低延迟双向数据交换,从而有助于快速创建在线游戏、即时社交网络通知、实时显示股市和天气信息,以及其他实时数据。
实现 WebSocket
如果你按照下列步骤进行操作,则实现此数据交换新技术将非常简单:
1. 使用一个客户端浏览器来实现 WebSocket 协议。
2. 在网页中编写代码来创建客户端 Websocket。
3. 在 Web 服务器上编写代码来通过 Websocket 响应客户端请求。
使用 WebSocket 客户端
Internet Explorer 10 实现 WebSocket 协议,如同其他主流浏览器的行为。你可在 caniuse.com 网站上看到浏览器支持的当前状态。
在 IETF 工具网站中指定的 WebSocket 协议使用以下新的 URL 方案。
HTML
ws://wss://
编写 WebSocket 客户端代码
你的网页代码必须执行以下操作:
1. 初始化 websocket 并连接到服务器。
2. 测试以查看它是否成功。
3. 发送和接收数据。
以下代码显示了指定 websocket URL 的典型代码:
JavaScript
var host = 'ws://example.microsoft.com';
以下代码显示了如何连接到 websocket 并测试以查看它是否成功。
JavaScript
var host = "ws://sample-host/echo"; try { socket = new WebSocket(host); socket.onopen = function (openEvent) { document.getElementById("serverStatus").innerHTML = 'WebSocket Status:: Socket Open'; }; socket.onmessage = function (messageEvent) { if (messageEvent.data instanceof Blob) { var destinationCanvas = document.getElementById('destination'); var destinationContext = destinationCanvas.getContext('2d'); var image = new Image(); image.onload = function () { destinationContext.clearRect(0, 0, destinationCanvas.width, destinationCanvas.height); destinationContext.drawImage(image, 0, 0); } image.src = URL.createObjectURL(messageEvent.data); } else { document.getElementById("serverResponse").innerHTML = 'Server Reply:: ' + messageEvent.data; } }; socket.onerror = function (errorEvent) { document.getElementById("serverStatus").innerHTML = 'WebSocket Status:: Error was reported'; }; socket.onclose = function (closeEvent) { document.getElementById("serverStatus").innerHTML = 'WebSocket Status:: Socket Closed'; }; } catch (exception) { if (window.console) console.log(exception); } } function sendTextMessage() { if (socket.readyState != WebSocket.OPEN) return; var e = document.getElementById("textmessage"); socket.send(e.value); } function sendBinaryMessage() { if (socket.readyState != WebSocket.OPEN) return; var sourceCanvas = document.getElementById('source'); socket.send(sourceCanvas.msToBlob()); }
前面的代码假设你有 serverStatus
、destination
、serverResponse
、textmessage
和 serverData
作为你的网页中带 ID 的元素。如果 F12 开发人员工具正在运行,捕获结果将显示在控制台窗口中。 要发送文本消息数据,请使用以下类型的代码。
JavaScript
var e = document.getElementById("msgText");socket.send(e.value);
上面的代码示例假设你有要使用网页中带 ID 的 msgText 元素发送的消息文本。同样,你可以使用 onmessage 事件检测新消息或使用 send 方法发送消息到服务器。send 方法可用于发送文本、二进制数组或 Blob 数据。
编写 WebSocket 服务器代码
处理套接字的服务器代码能够以任何服务器语言编写。无论你选择哪种语言,都必须编写代码以接受 WebSocket 请求并相应地处理它们。
WebSocket 编程
WebSocket 提供一组可用于 WebSocket 编程的对象、方法和属性。
- WebSocket使用之API
- WebSocket 之 Java API
- HTML5实战与剖析之使用HTML5 WebSocket API
- WebSocket使用之什么是WebSocket?
- Websocket使用之原理
- WebSocket API
- websocket api
- 微信小程序API之网络(四)WebSocket
- Html5 WebSocket API 的浏览器端简单使用
- 使用 HTML5 webSocket API实现即时通讯的功能
- 使用 JSR 356 API 构建 Java WebSocket 应用
- Nodejs之HTTP、WEBSOCKET及使用MYSQL
- 使用OkHttp之Websocket实现长连接
- HTML5--WebSocket API
- WebSocket API简介
- The WebSocket API
- HTML5 WebSocket API
- WebSocket API总结
- Linux下两台服务器文件实时同步方案设计和实现
- Ubuntu安装MySQL
- seq2seq代码部分解析
- 【javascript知识进阶】对象
- java后台测试代码向数据库写入的date类型的值始终为1970-01-01解决方法
- WebSocket使用之API
- Dropout:A Simple Way to Prevent Neural Networks from Overfitting
- hdu6153A Secret(扩展KMP)
- matlab错误使用 mex 未找到支持的编译器或 SDK
- spring cloud config server 配置中心
- Android Toolbar使用系统原生返回键,并改变其颜色,自定义图片替换系统原生返回键
- 设计模式之命令模式
- 总结下使用git上传项目到github
- ArgumentException: Getting control 0's position in a group with only 0 controls when doing Repaint A