• webSocket chapter 1

    WebSocket.OPEN 是 WebSocket 对象的一个属性，表示 WebSocket 连接的状态。其值为 1，表示连接已经打开并且可以进行通信。

    WebSocket 对象的状态有以下几种：

    • WebSocket.CONNECTING：值为 0，表示连接还未开启。
    • WebSocket.OPEN：值为 1，表示连接已经开启并且可以进行通信。
    • WebSocket.CLOSING：值为 2，表示连接正在关闭。
    • WebSocket.CLOSED：值为 3，表示连接已经关闭或者连接无法建立。
    3. html>
    4. <html>
    5.   <head>
    6.     <title>WebSocket Demotitle>
    7.   head>
    8.   <body>
    9.     <button id="sendButton">Send Messagebutton>
    10.     <script>
    11.       const socket = new WebSocket('ws://localhost:3000');
    12.     //   console.log(socket.binaryType, 'socket.binaryType');
    13.     //   socket.binaryType = 'arraybuffer';
    14.       socket.addEventListener('open', () => {
    15.         console.log('Connected to server');
    16.       });
    17.  
    18.       socket.addEventListener('message', (event) => {
    19.         console.log('Message from server: ', event.data);
    20.         console.log(event.data+'', 'event.data');
    21.         // blob 转换为字符串
    22.         // const reader = new FileReader();
    23.         // reader.onload = function () {
    24.         //   console.log('reader.result', reader.result);
    25.         // };
    26.         // reader.readAsText(event.data);
    27.       });
    28.  
    29.       document.getElementById('sendButton').addEventListener('click', () => {
    30.         socket.send('Hello Server!');
    31.       });
    32.     script>
    33.   body>
    34. html>

     

    1. /*
    2.  * when you set a variable | function | logic | declaration，please add  a  annotation as possible，God Bless You 🎈
    3.  *
    4.  * @Author: guoyongkun 👨‍💻
    5.  * @Date: 2024-02-24 09:17:47
    6.  * @LastEditors: guoyongkun 👨
    7.  * @LastEditTime: 2024-02-24 10:50:19
    8.  * @FilePath: /websocket/server.js
    9.  * @Description: please  set some  description for this file , let's improve the  code maintainability 💡 ...
    10.  */
    11. // server.js
    12. const express = require('express');
    13. const WebSocket = require('ws');
    14. const http = require('http');
    15. // const Blob = require('blob');
    16. const app = express();
    17. // const Blob = require('fetch-blob');
    18. // import Blob from 'fetch-blob';
    19. // console.log('app99',app);
    20. const server = http.createServer(app);
    21. const wss = new WebSocket.Server({server});
    22.  
    23. wss.on('connection', (ws) => {
    24.   console.log('Client connected');
    25.  
    26.   ws.on('message', (message) => {
    27.     console.log('Received: ' + message);
    28.     console.log(message + 'message1');
    29.     // Broadcast the message to all clients
    30.     console.log(wss.clients.size, 'wss.clients.size');
    31.     // console.log(wss.clients,'wss.clients');
    32.     wss.clients.forEach((client) => {
    33.       if (client.readyState === WebSocket.OPEN) {
    34.         console.log('Send message to client', client.readyState);
    35.         console.log(message, 'message2');
    36.         client.send(message);
    37.       }
    38.     });
    39.   });
    40.  
    41.   ws.on('close', () => {
    42.     console.log('Client disconnected');
    43.   });
    44. });
    45.  
    46. server.listen(3000, () => {
    47.   console.log('Server is running on port 3000');
    48. });
    49.  
    50. import('fetch-blob').then((module) => {
    51.   //   console.log(module, 'module.default');
    52.   //   let blob1 = new module.Blob(['123'], {type: 'text/plain'});
    53.   //   console.log(blob1+'1', 'blob1');
    54. });
    55.  
    56. // 创建一个长度为 10 的 Buffer，填充为 0
    57. const buf1 = Buffer.alloc(10);
    58. console.log(buf1, 'buf1');//
    59. buf1.write('123');
    60. console.log(buf1, 'buf1');//
    61. // 读取 Buffer 中的数据
    62. for (let i = 0; i < buf1.length; i++) {
    63.   console.log(buf1[i]); // 打印每个字节 // 49 50 51 0 0 0 0 0 0 0
    64. }
    65. //读取 Buffer 中的数据
    66. console.log(buf1.toString()); /// 123

  • 相关阅读:
    第一章《初学者问题大集合》第1节：我能学会编程吗
    [微前端实战]---03微前端实现方式对比
    Leetcode—392.判断子序列【简单】
    OFDM深入学习及MATLAB仿真
    面试官：Netty心跳检测机制是什么，怎么自定义检测间隔时间？
    HTML+CSS大作业 格林蛋糕(7个页面) 餐饮美食网页设计与实现
    Linux基本指令(一)
    Pandas中的宝藏函数-map
    数字化时代，传统IT和数字型IT能否严格区分？
    PCF8574/ PCF8574A/ PCF8574T I2C to parellal 8-bits I/O
  • 原文地址：https://blog.csdn.net/gu2022_3_5_21_23/article/details/136270473