共计 2903 个字符，预计需要花费 8 分钟才能阅读完成。
近期应用融云开发聊天页面, 通过抓包, 发现融云 SDK 应用 WebSocket 实现与服务端通信, 由此简略理解下 WebSocket 的应用
须要 WebSocket 的起因:
一句话总结: HTTP 协定只能由客户端发动, 服务端响应. WebSocket 可服务端被动发动, 也可客户端发动. 能实现的场景更多、更简单
相干材料如下:
融云开发文档: https://docs.rongcloud.cn/v4/
WebSocket Web API: https://developer.mozilla.org/zh-CN/docs/Web/API/WebSocket
WebSocket Node API: socket.io、ws、uWebSockets (任选其一)
融云抓包
测试地址: https://rongcloud.github.io/websdk-demo/api-test/
通过抓包可知, 融云链接 websocket 时还带了 appkey、token、SDK 版本信息
接下来实现一个简略地 客户端 + 服务端示例
Nodejs 服务端
此处示例应用 ws 模块
创立链接:
const Port = '2928';
const wss = new WebSocket.Server({port: Port});
wss.on('connection', function (ws, event) {
const url = event.url; // url 为客户端链接地址, 可拼接参数. 比方融云拼接了 appkey 等信息: ?appid=n19xxxxxx&token=xxxxxxxx
/* 监听链接敞开 */
ws.on('close', () => {// 此 ws 链接已断开. do something});
});监听客户端音讯:
const Port = '2928';
const wss = new WebSocket.Server({port: Port});
wss.on('connection', function (ws, event) {ws.on('message', function (data) {console.log('data', data); // 收到客户端发送的数据 do something
});
});向客户端发送申请:
const Port = '2928';
const wss = new WebSocket.Server({port: Port});
wss.on('connection', function (ws, event) {ws.send('some data');
});Web 客户端
具体 API 可参考: WebSocket
建设链接:
const socket = new WebSocket('ws://localhost:2928');
socket.addEventListener('open', function (event) {// 链接胜利, do something});监听服务端音讯:
const socket = new WebSocket('ws://localhost:2928');
socket.addEventListener('message', function (event) {console.log('收到服务端发送的数据', event.data);
});向服务端发送申请:
const socket = new WebSocket('ws://localhost:2928');
socket.addEventListener('open', function (event) {socket.send('some data'); // 链接后, 调用 send 发送
});近期应用融云开发聊天页面, 通过抓包, 发现融云 SDK 应用 WebSocket 实现与服务端通信, 由此简略理解下 WebSocket 的应用
须要 WebSocket 的起因:
一句话总结: HTTP 协定只能由客户端发动, 服务端响应. WebSocket 可服务端被动发动, 也可客户端发动. 能实现的场景更多、更简单
相干材料如下:
融云开发文档: https://docs.rongcloud.cn/v4/
WebSocket Web API: https://developer.mozilla.org/zh-CN/docs/Web/API/WebSocket
WebSocket Node API: socket.io、ws、uWebSockets (任选其一)
融云抓包
测试地址: https://rongcloud.github.io/websdk-demo/api-test/
通过抓包可知, 融云链接 websocket 时还带了 appkey、token、SDK 版本信息
接下来实现一个简略地 客户端 + 服务端示例
Nodejs 服务端
此处示例应用 ws 模块
创立链接:
const Port = ‘2928’;
const wss = new WebSocket.Server({port: Port});
wss.on(‘connection’, function (ws, event) {
const url = event.url; // url 为客户端链接地址, 可拼接参数. 比方融云拼接了 appkey 等信息: ?appid=n19xxxxxx&token=xxxxxxxx
/ 监听链接敞开 /
ws.on(‘close’, () => {
// 此 ws 链接已断开. do something
});
});
监听客户端音讯:
const Port = ‘2928’;
const wss = new WebSocket.Server({port: Port});
wss.on(‘connection’, function (ws, event) {
ws.on(‘message’, function (data) {
console.log(‘data’, data); // 收到客户端发送的数据 do something
});
});
向客户端发送申请:
const Port = ‘2928’;
const wss = new WebSocket.Server({port: Port});
wss.on(‘connection’, function (ws, event) {
ws.send(‘some data’);
});
Web 客户端
具体 API 可参考: WebSocket
建设链接:
const socket = new WebSocket(‘ws://localhost:2928’);
socket.addEventListener(‘open’, function (event) {
// 链接胜利, do something
});
监听服务端音讯:
const socket = new WebSocket(‘ws://localhost:2928’);
socket.addEventListener(‘message’, function (event) {
console.log(‘ 收到服务端发送的数据 ’, event.data);
});
向服务端发送申请:
const socket = new WebSocket(‘ws://localhost:2928’);
socket.addEventListener(‘open’, function (event) {
socket.send(‘some data’); // 链接后, 调用 send 发送
});
