WebSocket入门及示例
前言
一直在想要不要写下这篇，因为网上关于websocket的介绍和使用的好文实在太多太多，例如有这篇和这篇。
但我不管了，写下来，这样我就不用在想使用的时候总是去翻写过的源码了。
先回答几个简单的问题。
什么是websocket？websocket有什么用？什么时候用websocket？
这几个问题一起回答。WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。
全双工的意思差不多就是客户端可以向服务器通信，服务器也可以向客户端通信，
而以前使用的HTTP协议只能客户端向服务器通信，如果想要得到服务器的消息，只能不断地向服务器发起请求，
然而实在没什么消息的话，不断发请求实则是一种资源浪费，所以这种时候就需要使用websocket了。
websocket能保持一种长连接，而且服务器能主动向客户端发消息，对于那种需要保持长时间联系的场景那再适合不过了！
示例
websocket的使用非常的简单，下面是一个实例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>websocket</title>
</head>
<body>
<button id="openWS">连接</button>
<button id="closeWS">关闭</button>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script> var ws; // 先创建一个全局变量 $('#openWS').click(function(){ // 创建websocket的实例
// 实例一旦成功创建就会建立websocket连接
ws = new WebSocket('ws://xxx.com'); }); // 主动关闭连接
$('#closeWS').click(function(){
ws.close();
}); // 监听打开
ws.onopen = function() {
console.log('连接成功');
// 做你想做的事
}; // 监听错误
ws.onerror = function(){
console.log('连接失败');
// 做你想做的事
}; // 监听消息
ws.onmessage = function(data) {
console.log(data);
// 做你想做的事
}; // 监听窗口关闭 在窗口关闭前自动关闭连接
ws.onbeforeunload = function(){
ws.close();
}; // 监听关闭
ws.onclose = function() {
console.log('连接关闭');
// 做你想做的事
}; // 在建立websocket连接之后，就可以向服务器发送消息
var data = '我想告诉你';
ws.send(data); </script>
</body>
</html>
更多的实例属性和方法点这里。
WebSocket入门及示例的更多相关文章
- Spring WebSocket初探2 (Spring WebSocket入门教程)<转>
See more: Spring WebSocket reference整个例子属于WiseMenuFrameWork的一部分,可以将整个项目Clone下来,如果朋友们有需求,我可以整理一个独立的de ...
- WebSocket入门教程（五）-- WebSocket实例：简单多人聊天室
from:https://blog.csdn.net/u010136741/article/details/51612594 [总目录] WebSocket入门教程--大纲 [实例简介] ...
- C# 实现WEBSOCKET聊天应用示例
C# 实现WEBSOCKET聊天应用示例 http://blog.163.com/da7_1@126/blog/static/10407267820121016103055506/ 2012-11-1 ...
- Python开发 之 Websocket 的使用示例
1.唠唠叨叨 最近又回顾了下Websocket,发现已经忘的七七八八了.于是用js写了客户端,用python写了服务端,来复习一下这方面的知识. 2.先看一下效果吧 2.1.效果1(一个客户端连上服务 ...
- C# WebSocket 服务端示例代码 + HTML5客户端示例代码
WebSocket服务端 C#示例代码 using System; using System.Collections.Generic; using System.Linq; using System. ...
- Spring MVC 入门教程示例 （一）
今天和大家分享下 Spring MVC 入门教程 首先还是从 HelloWorld web 工程开始 -------------------------- 1.首先创建一个Maven Web工程 ...
- NetCore WebSocket 即时通讯示例
1.新建Netcore Web项目 2.创建简易通讯协议 public class MsgTemplate { public string SenderID { get; set; } public ...
- wxPython 入门开发示例
1.背景资料 wxPython API:https://www.wxpython.org/Phoenix/docs/html/ 2.入门示例 wxPython最重要的两个概念:App与Frame,其中 ...
- 周记1——WebSocket入门
一周复一周,时间过得飞快,每个周末都是很开心却又很彷徨.开心的是不用工作,彷徨的是自己这周学到了什么.自身的技能有没有提高.如何应对这个日新月异的社会... 本周的工作的开发IM(即时聊天)模块,要用 ...
随机推荐
- tensorflow学习001——MNIST
1.MNIST是一个入门级的计算机视觉数据集,它包含各种手写数字图片 数据集被分成两部分:60000行的训练数据集(mnist.train)和10000行的测试数据集(mnist.test). 这样的 ...
- Memcache,redis，rabbitMQ,SQLAlchemy
Memcached Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提高动态.数据库驱动网站的速度 ...
- javap浅析-书籍第3章的手写稿样稿
转载于:[xieyu_zy](http://blog.csdn.net/xieyuooo/article/details/17452383) 3.2.1javap命令工具 第1章中我们就提到了有些地方 ...
- 有什么学习MySQL的好教程吗？
有什么学习Mysql的好教程吗? 文档是最好的,现整理如下: [mysql教程]MySQL 教程 [MySQL教程]MySQL 安装 [MySQL教程]MySQL 管理 [MySQL教程]MySQ ...
- Python的内置函数
python的内置函数一共有68个,下面将简单介绍各个函数的功能. abs() dict() help() min() setattr() all() dir() hex() next() slice ...
- python 给定数组任意组合等于一个定值的所有解
抛出问题: 求给定数组任意组合等于一个定值的所有解 例如列表l = [1, 2, 3, 4, 5],求任意组合的结果为10的所有答案 问题分析: 实际就是列表的所有排列组合,然后算出每个排列组合的值, ...
- java-设计模式-索引
设计模式的七大原则 设计模式遵循的七大原则 微信红包的设计实践 单例模式 常见的几种单例模式写法 单例模式的应用场景及优缺点 面向对象六大设计原则 JAVA设计模式之观察者模式 JAVA设计模式之策略 ...
- NumPy基础
一.NumPy ndarray (一)生成ndarray 表 数组生成函数 函数 描述(默认数据类型是float64) array 将输入数据(序列型对象)转换为ndarray,若不显示的指定数据类型 ...
- 移动端常用UI框架
作为一个前端人员来说,总结几款相对来说不错的用于移动端开发的UI框架是非常必要的,以下几种移动端UI框架就能基本满足工作中开发需要,根据项目需求,选用合适的框架搭建项目,更能容易提高开发效率. 一.M ...
- C语言程序实现，统计字符串里面各个字符的个数在总字符个数中的比例，并打印输出。
#include<stdio.h> int main() { char *ppp= "aaassadddeeds"; ] = {};//存放字符 uint32 ccnt ...