html websocket的基本使用
html websocket的基本使用
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><style>div {width: 200px;height: 200px;border: 1px solid #30897c;}</style><title>聊天室</title></head><body><input type="text" placeholder="输入你的内容" name="" id="" /><button>发送请求</button><!-- 显示结果 --><div></div></body>
</html><script>var input = document.querySelector("input");var button = document.querySelector("button");var div = document.querySelector("div");// 演示websocket在浏览器端如何使用// H5已经直接提供了websocket的API，所以我们可以直接使用// 1.创建websocket// 参数1:websocket的服务器地址var socket = new WebSocket("ws://localhost:3000"); //看02里面端口号是多少// open：当和websocket服务器连接成功的时候触发socket.addEventListener("open", function () {div.innerHTML = "连接服务成功了！";});// 3，主动给websocket服务发送消息button.addEventListener("click", () => {var value = input.value;socket.send(value);});// 4.接受websocket服务的数据socket.addEventListener("message", (e) => {console.log(e.data);div.innerHTML = e.data;});socket.addEventListener("close", () => {console.log("服务器断开。。。");});
</script>相关文章：
html websocket的基本使用
html websocket的基本使用 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta http-equiv"X-UA-Compatible" content"IEedge" /><meta name"viewport" content"w…...
大数据 MapReduce是什么？
在Hadoop问世之前，其实已经有了分布式计算，只是那个时候的分布式计算都是专用的系统，只能专门处理某一类计算，比如进行大规模数据的排序。 很显然，这样的系统无法复用到其他的大数据计算场景，每一种应用都…...
ubuntu 如何放开防火墙端口，ubuntu 防火墙操作命令，ubuntu 防火墙全面操作说明
本文介绍了Ubuntu操作系统有关防火墙操作的命令。为了便于说明，请使用 root 用户或具有超级管理员权限的用户登录到 Ubuntu 系统，这样操作命令前就不需要加 sudo了。 一、安装防火墙 如果没有安装防火墙，请用如下命令安装： apt …...
计算机视觉入门与调优
大家好啊，我是董董灿。 在 CSDN 上写文章写了有一段时间了，期间不少小伙伴私信我，咨询如何自学入门AI，或者咨询一些AI算法。 90%的问题我都回复了，但有时确实因为太忙，没顾得过来。 在这个过程中&#x…...
Ndk编译hevc静态库
源码下载: https://hg.videolan.org/x265 然后执行以下脚本: #!/bin/bash# 设置NDK路径，根据你的实际安装路径修改 NDK_PATH/mnt/c/Users/Administrator/ubuntu_dev/ndk/android-ndk-r21e# 设置目标平台和ABI版本，可以根据实际情况修改 aarch64-linux-…...
Linux系统安装MySQL
Linux系统安装MySQL 第一步：下载YUM wget http://dev.mysql.com/get/mysql57-community-release-el7-11.noarch.rpm第二步：安装MySQL的YUM 仓库 rpm -ivh mysql57-community-release-el7-11.noarch.rpm第三步：查看MySQL版本 yum repolist …...
linux go环境安装 swag
下载依赖包 go get -u github.com/swaggo/swag编译 移动到下载的swag包目录,一般在$GOPATH/pkg/mod下 查看 GOPATH echo $GOPATHcd /root/GolangProjects/pkg/mod/github.com/swaggo/swagv1.16.2go install ./cmd/swag/不出意外，$GOPATH/bin下 已经有了swag 初…...
高效分割视频：批量剪辑，轻松提取m3u8视频技巧
在数字媒体时代，视频分割是一项常见的需求。无论是为了编辑、分享还是其他要求，经常要将长视频分割成多个短片。传统的视频分割方法往往需要手动操作，既耗时又容易出错。现在来看云炫AI智剪高效分割视频的方法，批量剪辑并轻松提取…...
自由DIY预约小程序源码系统：适用于任何行业+自由DIY你的界面布局+全新升级的UI+多用户系统 带安装部署教程
随着移动互联网的普及，预约服务逐渐成为人们日常生活的一部分。从家政服务、医疗挂号到汽车保养，预约已经渗透到各个行业。然而，市面上的预约小程序大多功能单一，界面老旧，无法满足商家和用户的个性化需求。今天来给大…...
el-select 多选，选有一个未选择的选项
多选有未选择这个选项后。会出现一个情况，绑定的数据为[‘未选择’,‘cpu1’,‘cpu2’] 进行一个处理，选择（未选择）就清除（其它的选择），选择（cpu）就清除（未选…...
CISSP 第6章： 密码学与对称加密算法
第六章 密码学与对称加密算法 6.1 密码学历史上的里程碑 6.1.1 凯撒密码 简单的将字母表中的每个字母替换成其后的三个字母，是单一字母的替代置换密码 6.1.2 美国内战 美国内战使用词汇替代和置换的复杂组合，从而试图破坏敌人的破译企图 6.1.3 Ultra与…...
《深入理解C++11：C++11新特性解析与应用》笔记八
第八章 融入实际应用 8.1 对齐支持 8.1.1 数据对齐 c可以通过sizeof查询数据的长度，但是没有对对齐方式有关的查询或者设定进行标准化。c11标准定义的alignof函数可以查看数据的对齐方式。 现在的计算机通常会支持许多向量指令，4组8字节的浮点数据&a…...
算法——BFS解决FloodFill算法
什么是FloodFill算法 中文：洪水灌溉。假设这一块4*4的方格是一块土地，有凸起的地方，也有凹陷的地方（凹陷的地方用负数表示）。此时下大雨发洪水，会把凹陷的地方填满。绿色圈起来的属于一块区域（…...
【Linux】常用的基本命令指令②
前言：前面我们学习了Linux的部分指令，今天我们将接着上次的部分继续将Linux剩余的基本指令. 💖 博主CSDN主页:卫卫卫的个人主页 💞 👉 专栏分类:Linux的学习 👈 💯代码仓库:卫卫周大胖的学习日记…...
52、全连接 - 特征与样本空间的对应关系
上一节说到经过全连接层之后，神经网络学习到的特征，会从隐层特征空间逐步映射到样本空间，这主要是由于全连接层可以融合全局的特征。 在经过全连接层之后，在 ResNet50 这个神经网络中会输出1000个特征的得分值，这1000个特征的得分值，便可以对应到图像的分类。 怎么对应…...
Go语言中的包管理工具之Go Vendor的使用
GoLang 中常用的包管理的方式 常用的有三种 Go PathGo VendorGo Modules 关于 Go Vender 1 ）概述 在2015年的时候，我们的另一个包管理工具Go Vendor就诞生了它诞生于 2015.8.19 ，是在Go的 1.5 版本当中引入的，它默认是关闭的我…...
QString设置小数点精度位数
QString设置小数点精度位数 Chapter1 QString设置小数点精度位数Chapter2 Qt中QString.toDouble有效位数6位问题以及数据小数点有效位数的处理问题一：QString.toDouble有效位只有6位问题二:小数点有效位数的问题 Chapter3 qt QString转Double只显示6位数字的问题(精…...
基于Java驾校预约管理系统
基于Java的驾校预约管理系统是一个为驾校提供在线预约服务的系统。该系统利用Java编程语言，采用SSM框架，并使用MySQL数据库进行开发。 这个系统主要有三个角色：用户、教练和管理员。 用户可以注册和登录系统，查看驾校的公告信息…...
C++面向对象高级编程（侯捷）笔记2
侯捷C面向对象高级编程 本文是学习笔记，仅供个人学习使用，如有侵权，请联系删除。 如果你对C面向对象的组合、继承和委托不了解，对什么是拷贝构造、什么是拷贝赋值和析构不清楚，对类设计中的Adapter、pImpl、Template…...
 优化麦克劳林公式)
双曲正弦函数(*) 优化麦克劳林公式
#include<stdio.h> #include<math.h> int main() {double x,eps,i3,y,item;scanf("%lf%lf",&x,&eps);yx;itemx;while(fabs(item)>eps){itemitem*x*x/i/(i-1);i2;yitem;}printf("%.6f\n",y);return 0; }...
安宝特方案丨XRSOP人员作业标准化管理平台：AR智慧点检验收套件
在选煤厂、化工厂、钢铁厂等过程生产型企业，其生产设备的运行效率和非计划停机对工业制造效益有较大影响。 随着企业自动化和智能化建设的推进，需提前预防假检、错检、漏检，推动智慧生产运维系统数据的流动和现场赋能应用。同时，…...
django filter 统计数量 按属性去重
在Django中，如果你想要根据某个属性对查询集进行去重并统计数量，你可以使用values()方法配合annotate()方法来实现。这里有两种常见的方法来完成这个需求： 方法1：使用annotate()和Count 假设你有一个模型Item，并且你想…...
《通信之道——从微积分到 5G》读书总结
第1章 绪 论 1.1 这是一本什么样的书 通信技术，说到底就是数学。 那些最基础、最本质的部分。 1.2 什么是通信 通信 发送方 接收方 承载信息的信号 解调出其中承载的信息 信息在发送方那里被加工成信号（调制） 把信息从信号中抽取出来&am…...
什么是Ansible Jinja2
理解 Ansible Jinja2 模板 Ansible 是一款功能强大的开源自动化工具，可让您无缝地管理和配置系统。Ansible 的一大亮点是它使用 Jinja2 模板，允许您根据变量数据动态生成文件、配置设置和脚本。本文将向您介绍 Ansible 中的 Jinja2 模板，并通…...
安全突围：重塑内生安全体系：齐向东在2025年BCS大会的演讲
文章目录 前言第一部分：体系力量是突围之钥第一重困境是体系思想落地不畅。第二重困境是大小体系融合瓶颈。第三重困境是“小体系”运营梗阻。 第二部分：体系矛盾是突围之障一是数据孤岛的障碍。二是投入不足的障碍。三是新旧兼容难的障碍。 第三部分&am…...
C# 表达式和运算符(求值顺序)
求值顺序 表达式可以由许多嵌套的子表达式构成。子表达式的求值顺序可以使表达式的最终值发生 变化。 例如，已知表达式3*52，依照子表达式的求值顺序，有两种可能的结果，如图9-3所示。 如果乘法先执行，结果是17。如果5…...
解决：Android studio 编译后报错\app\src\main\cpp\CMakeLists.txt‘ to exist
现象： android studio报错： [CXX1409] D:\GitLab\xxxxx\app.cxx\Debug\3f3w4y1i\arm64-v8a\android_gradle_build.json : expected buildFiles file ‘D:\GitLab\xxxxx\app\src\main\cpp\CMakeLists.txt’ to exist 解决： 不要动CMakeLists.…...
TSN交换机正在重构工业网络，PROFINET和EtherCAT会被取代吗？
在工业自动化持续演进的今天，通信网络的角色正变得愈发关键。 2025年6月6日，为期三天的华南国际工业博览会在深圳国际会展中心（宝安）圆满落幕。作为国内工业通信领域的技术型企业，光路科技（Fiberroad&…...
React父子组件通信：Props怎么用？如何从父组件向子组件传递数据？
系列回顾： 在上一篇《React核心概念：State是什么？》中，我们学习了如何使用useState让一个组件拥有自己的内部数据（State），并通过一个计数器案例，实现了组件的自我更新。这很棒&#…...
【大模型】RankRAG：基于大模型的上下文排序与检索增强生成的统一框架
文章目录 A 论文出处B 背景B.1 背景介绍B.2 问题提出B.3 创新点 C 模型结构C.1 指令微调阶段C.2 排名与生成的总和指令微调阶段C.3 RankRAG推理：检索-重排-生成 D 实验设计E 个人总结 A 论文出处 论文题目：RankRAG：Unifying Context Ranking…...