这篇文章将为大家详细讲解有关WebSocket的使用方法从，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。
WebSocket的使用
WebSocket是HTML5的新协议，所以支持HTML5的浏览器都能直接使用WebSocket不需要额外安装，什么开发包，或者插件。
为了测试WebSocket我们需要简单的搞一个服务端程序。Node.js本身支持的协议包括TCP协议和HTTP协议，但不支持WebSocket，为了让让node也支持WebSocket，这里我选用ws模块。
测试
创建一个名为testWebSocket的文件夹，使用npm init 初始化项目
配置package.json文件添加，这里选用ws的最新的版本
"dependencies": {
"ws": "^6.2.1"
}
在根目录使用npm指令npm install --save，把ws相关依赖都拉下来。
然后创建一个名为myWebSocketServer.js的文件，一个简单的WebSocket服务端程序完成，
node myWebSocketServer.js先让服务端跑起来。相关教程：webSocket 视频教程
const WebSocket = require('ws');
let i = 1;
const WebSocketServer = WebSocket.Server;
const myWs = new WebSocketServer({
port: 8080
});
myWs.on('connection', ws => {
ws.on('message', message => {
console.log('received: %s', message);
});
setInterval(() => {
ws.send('Hello siegaii this is serverMessage!' + i);
i++;
}, 1000);
});
客户端
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
<button id="test">hello siegaii</button>
<script>
let ws = new WebSocket('ws://localhost:8080/testWebSocket');
document.getElementById('test').addEventListener('click', () => {
ws.send('Hello Siegaii this is clientMessage!');
});
ws.onmessage = (msg) => {
console.log(msg);
};
</script>
</body>
</html>
运行结果如下
API
简单介绍下WebSocket的api
let socket = new WebSocket(url, [protocol] );
socket.readyState
socket.bufferedAmount
socket.onopen();
socket.onmessage();
socket.onerror();
socket.onclose();
Socket.send()
Socket.close()
关于WebSocket的使用方法从就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。