一文详细了解websocket应用以及连接断开的解决方案

文章目录

    • websocket
    • vite 热启动探索
    • websocket -心跳
    • websocket 事件监听
    • 应用过程中问题总结

websocket

  1. Websocket简介
    • 定义和工作原理
      • Websocket是一种在单个TCP连接上进行全双工通信的协议。与传统的HTTP请求 - 响应模式不同，它允许服务器主动向客户端推送数据。例如，在一个实时聊天应用中，当一个用户发送消息后，服务器可以立即将这条消息推送给其他相关用户，而不需要客户端不断地轮询服务器来检查是否有新消息。
      • 它的工作过程是这样的：首先，客户端通过发送一个HTTP请求来建立Websocket连接，这个请求包含特殊的请求头，表明这是一个Websocket升级请求。服务器收到请求后，如果支持Websocket协议，就会返回一个状态码为101（Switching Protocols）的响应，表示协议切换成功，之后双方就可以通过这个建立好的连接进行双向通信了。
    • 在浏览器中的应用场景
      • 实时数据更新场景，如金融数据的实时展示。股票价格是不断变化的，通过Websocket，浏览器可以实时接收服务器推送的最新股票价格数据，并更新页面上的显示内容。
      • 在线游戏也是典型的应用场景。游戏中的玩家状态更新、实时对战信息等都可以通过Websocket在服务器和浏览器之间快速传递，保证游戏的实时性和流畅性。
  2. Webpack与Vite在Vue项目中的基本情况
    • Webpack
      • 定义和功能：Webpack是一个模块打包工具。它可以将Vue项目中的各种资源（如JavaScript文件、CSS文件、图片等）视为模块，并根据配置规则将它们打包成一个或多个文件，用于在浏览器中高效地加载和运行。
      • 工作流程：它会从一个入口文件开始，递归地构建一个依赖关系图，这个依赖关系图包含了项目中所有模块之间的依赖关系。然后，根据配置中的加载器（loader）和插件（plugin）对这些模块进行处理，例如将ES6代码转换为ES5代码、将SASS文件转换为CSS文件等，最后将处理后的模块打包成最终的输出文件。
    • Vite
      • 定义和功能：Vite是一种新型的前端构建工具，它的主要特点是利用了浏览器原生的ES模块支持，在开发阶段提供了更快的冷启动速度和热模块替换（HMR）。在Vue项目中，Vite可以快速地启动开发服务器，并且能够高效地处理模块的更新。
      • 工作流程：在开发模式下，Vite不需要像Webpack那样打包整个项目，而是直接利用浏览器对ES模块的支持，当浏览器请求一个模块时，Vite会即时编译并返回这个模块的内容。在构建生产版本时，Vite也会进行一定程度的优化和打包，以确保项目在生产环境中的性能。
  3. 在运行Vue项目中连接Websocket的方式
    • 在Vue项目中使用原生Websocket API
      • 在Vue组件中，可以通过new WebSocket('ws://your - websocket - server - url')来创建一个Websocket连接。例如：
      export default {data() {return {socket: null,messages: []};},mounted() {this.socket = new WebSocket('ws://localhost:8080');this.socket.addEventListener('open', () => {console.log('Websocket connection opened');});this.socket.addEventListener('message', (event) => {this.messages.push(event.data);});this.socket.addEventListener('close', () => {console.log('Websocket connection closed');});}
}
      • 上述代码在mounted生命周期钩子中创建了一个Websocket连接。当连接打开时，会在控制台打印一条消息；当收到消息时，会将消息内容添加到messages数组中；当连接关闭时，也会打印相应的消息。
    • 使用第三方库（如Socket.io）辅助连接（以Webpack为例）
      • 首先安装socket.io - client库，通过npm install socket.io-client。
      • 然后在Vue组件中引入并使用：
      import io from'socket.io - client';
export default {data() {return {socket: null,messages: []};},mounted() {this.socket = io('http://localhost:8080');this.socket.on('connect', () => {console.log('Socket.io connection established');});this.socket.on('message', (data) => {this.messages.push(data);});this.socket.on('disconnect', () => {console.log('Socket.io connection lost');});}
}
      • 这里使用socket.io-client库来建立连接，它提供了更简洁的API和一些额外的功能，如自动重连等。在Webpack项目中，需要确保在webpack.config.js中正确配置了相关的加载器和插件，以处理引入的第三方库。
  4. Websocket应用更新相关内容（结合Webpack和Vite的热更新机制）
    • Webpack热模块替换（HMR）与Websocket更新配合
      • Webpack的HMR允许在运行时更新模块，而不需要刷新整个页面。当Websocket收到新的数据导致相关模块需要更新时，Webpack的HMR可以发挥作用。例如，在一个展示实时数据的图表组件中，当Websocket收到新的图表数据后，Webpack可以通过HMR更新这个图表组件，而保持页面的其他部分不变。
      • 实现方式是通过配置webpack - dev - server的HMR选项，并且在Vue组件中编写相应的代码来处理模块更新。在webpack.config.js中，需要添加如下配置：
      module.exports = {//...其他配置devServer: {hot: true}
};
      • 然后在Vue组件中，可以使用module.hot.accept来处理模块更新。例如：
      if (module.hot) {module.hot.accept(['./components/Chart.vue'], () => {// 当Chart.vue模块更新时的处理逻辑console.log('Chart.vue has been updated');});
}
    • Vite热模块替换与Websocket更新配合
      • Vite的HMR机制更加高效。当Websocket触发数据更新导致模块需要更新时，Vite会快速地更新对应的模块。在Vue项目中，Vite会自动识别组件的更新并进行热替换。
      • 例如，当Websocket收到新的数据并更新了一个组件的数据状态时，Vite会重新渲染这个组件。在代码中，不需要像Webpack那样显式地配置很多HMR相关的内容，因为Vite默认就支持高效的热模块替换。但是，在组件内部仍然需要正确地处理数据更新的逻辑，比如通过watch属性或者computed属性来更新DOM显示。例如：
      export default {data() {return {dataFromSocket: null};},watch: {dataFromSocket(newValue) {// 根据新的数据更新DOMconsole.log('Data from Websocket updated:', newValue);}},mounted() {// 假设这里是Websocket接收数据的逻辑this.socket.addEventListener('message', (event) => {this.dataFromSocket = event.data;});}
}

vite 热启动探索

  1. Vite开发服务器端启动WebSocket连接
    • 启动过程
      • 当Vite启动开发服务器时，它会在内部初始化WebSocket服务器。这个过程是由Vite的核心代码完成的，具体来说是在服务端模块（通常基于Node.js）中实现的。Vite使用了一些底层的Node.js网络库来创建和管理WebSocket连接。
      • 例如，Vite可能会使用ws库（一个流行的Node.js WebSocket库）来建立服务器。在Vite的代码内部，大致会有如下的初始化步骤（简化代码）：
      const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 3000 }); // 假设端口为3000
    • 等待浏览器连接
      • 一旦WebSocket服务器建立，它就开始等待浏览器的连接请求。在这个阶段，服务器会监听指定的端口（如上述例子中的3000端口），并准备好处理浏览器发送过来的WebSocket连接请求。
      • 当浏览器请求连接时，服务器会进行一系列的握手操作来建立连接。这个握手过程是基于WebSocket协议标准的，包括交换一些协议头信息，以确保双方都支持WebSocket通信并且能够理解对方发送的消息。
  2. 浏览器端建立连接的方式
    • HTML页面中的脚本触发连接
      • 在Vite开发的项目中，浏览器会加载项目的HTML页面。在这个HTML页面中，通常会有一个JavaScript脚本（可能是在<script type="module">标签中）来触发与Vite开发服务器的WebSocket连接。
      • 例如，在Vite生成的HTML页面的<script>标签（或者是在入口的JavaScript模块中）可能会有这样的代码来建立连接：
      const socket = new WebSocket('ws://localhost:3000');
      • 这里的ws://localhost:3000是WebSocket连接的URL，其中localhost是开发服务器的主机名，3000是服务器监听的端口号。这个URL的格式是根据WebSocket协议规范来定义的，告诉浏览器要连接到哪个服务器和端口。
    • 连接事件处理
      • 当浏览器发起连接请求后，会触发一系列的事件。首先是open事件，在这个事件的处理函数中，可以进行一些初始化操作，比如向服务器发送一些初始信息或者设置一些连接相关的状态。例如：
      socket.addEventListener('open', () => {console.log('WebSocket connection opened');// 可以在这里向服务器发送初始消息，如客户端的一些环境信息等
});
    • 接收和发送消息的机制
      • 一旦连接建立成功，浏览器和服务器就可以通过这个WebSocket连接进行双向通信。在浏览器端，可以通过send方法向服务器发送消息，例如：
      socket.send('This is a message from the browser');
      • 同时，浏览器需要监听服务器发送过来的消息。这是通过监听message事件来实现的，当服务器发送消息过来时，message事件会被触发，然后可以在事件处理函数中对消息进行处理，例如：
      socket.addEventListener('message', (event) => {const message = event.data;console.log('Received message:', message);// 根据收到的消息内容进行相应的操作，如更新组件等
});
  3. Vite热更新中的消息传递与连接维护
    • 在Vite的热更新过程中，服务器（Vite开发服务器）会利用这个已经建立的WebSocket连接向浏览器发送更新消息。当一个Vue组件或者其他模块文件发生变化时，Vite会重新编译相关模块，并将更新消息（包含更新的模块路径、新的模块代码等内容）通过WebSocket发送给浏览器。
    • 浏览器收到更新消息后，会根据消息中的内容进行模块更新操作。这个过程中，WebSocket连接会一直保持开启状态，除非遇到网络问题、浏览器关闭或者开发服务器停止等情况。通过这种方式，Vite实现了高效的热更新推送机制，使得浏览器能够及时获取模块更新信息并进行相应的处理，从而提供流畅的开发体验。

websocket -心跳

  1. 理解心跳机制
    • 心跳机制的原理
      • 心跳机制是为了保持连接的活跃状态。在Websocket通信中，客户端和服务器之间会周期性地发送一个很小的消息（心跳包）来互相确认对方还在连接状态。例如，客户端每隔一段时间（如10秒）向服务器发送一个简单的消息，服务器收到后回复一个确认消息。如果客户端在一定时间内没有收到服务器的回复，就可以认为连接出现问题，从而触发重连。
    • 在Nginx中的应用场景
      • Nginx作为反向代理服务器，在处理Websocket连接时，心跳机制可以帮助检测连接的有效性。当后端的Websocket服务器和客户端之间的连接长时间没有数据传输时，Nginx可以通过心跳包来判断连接是否还正常，避免因为网络波动等原因导致连接被错误地断开。
  2. Nginx配置心跳检测相关指令
    • proxy_read_timeout和proxy_send_timeout
      • 功能说明：proxy_read_timeout用于设置Nginx从后端服务器读取数据的超时时间，proxy_send_timeout用于设置Nginx向后端服务器发送数据的超时时间。这两个指令可以间接用于心跳检测。
      • 示例配置：
      location /websocket {proxy_pass http://backend - websocket - server;proxy_read_timeout 60s;proxy_send_timeout 60s;
}
      • 在上述配置中，Nginx在与后端Websocket服务器通信时，如果读取或发送数据超过60秒没有响应，就会认为连接出现问题。这个时间可以根据实际情况进行调整，例如，对于频繁发送心跳包的场景，可以适当缩短这个时间。
    • proxy_http_version和proxy_set_header
      • 功能说明：proxy_http_version用于设置代理的HTTP版本，对于Websocket，需要设置为1.1，因为Websocket是基于HTTP/1.1协议升级而来的。proxy_set_header用于设置发送到后端服务器的请求头。在Websocket连接中，需要正确设置Connection和Upgrade头来实现协议升级。
      • 示例配置：
      location /websocket {proxy_pass http://backend - websocket - server;proxy_http_version 1.1;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection "upgrade";proxy_read_timeout 60s;proxy_send_timeout 60s;
}
      • 这里通过设置proxy_http_version和proxy_set_header，正确地将客户端的Websocket升级请求转发到后端服务器，并且在心跳检测过程中，保证了协议的正确通信。
  3. 客户端和服务器端配合实现心跳机制
    • 客户端实现
      • 在客户端（如浏览器中的JavaScript代码），可以使用setInterval函数来定期发送心跳包。例如：
      let socket = new WebSocket('ws://your - websocket - url');
socket.addEventListener('open', () => {setInterval(() => {socket.send('heartbeat');}, 10000); // 每隔10秒发送一个心跳包
});
socket.addEventListener('message', (event) => {if (event.data === 'heartbeat - ack') {console.log('Heartbeat received from server');}
});
      • 上述代码在Websocket连接打开后，每隔10秒发送一个heartbeat消息作为心跳包。当收到服务器回复的heartbeat - ack消息时，会在控制台打印一条确认信息。
    • 服务器端实现（以Node.js为例）
      • 在服务器端（假设是基于Node.js的Websocket服务器），可以接收客户端的心跳包并回复确认消息。例如：
      const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', (socket) => {socket.on('message', (message) => {if (message === 'heartbeat') {socket.send('heartbeat - ack');}});
});
      • 这样，服务器收到客户端发送的heartbeat心跳包后，会发送heartbeat - ack消息进行回复，通过Nginx的心跳检测相关配置，就可以有效地减少因为连接超时而导致的重连情况。

websocket 事件监听

  1. open事件
    • 含义和触发时机
      • open事件在Websocket连接成功建立时触发。这意味着客户端和服务器之间的双向通信通道已经准备好，可以开始发送和接收消息。例如，当客户端发送了一个Websocket升级请求，服务器成功响应并完成协议切换后，open事件就会在客户端被触发。
    • 应用场景和示例代码（以浏览器端JavaScript为例）
      • 通常在open事件的处理函数中可以进行一些初始化操作，比如向服务器发送登录信息或者订阅某些频道。
      let socket = new WebSocket('ws://your - websocket - server - url');
socket.addEventListener('open', () => {console.log('Websocket connection opened successfully.');// 向服务器发送登录信息let loginData = {username: 'user1',password: 'password1'};socket.send(JSON.stringify(loginData));
});
  2. message事件
    • 含义和触发时机
      • message事件在客户端接收到服务器发送的消息或者服务器接收到客户端发送的消息时触发。无论是文本消息还是二进制消息都会触发这个事件。
    • 应用场景和示例代码（以浏览器端JavaScript为例）
      • 这个事件常用于接收和处理服务器推送的数据。例如，在一个实时聊天应用中，当服务器发送新的聊天消息时，message事件就会被触发，然后可以将消息显示在聊天界面上。
      let socket = new WebSocket('ws://your - websocket - server - url');
socket.addEventListener('message', (event) => {let message = event.data;// 假设消息是JSON格式的聊天消息let chatMessage = JSON.parse(message);let chatBox = document.getElementById('chat - box');let newMessageElement = document.createElement('p');newMessageElement.textContent = chatMessage.sender + ': ' + chatMessage.content;chatBox.appendChild(newMessageElement);
});
  3. close事件
    • 含义和触发时机
      • close事件在Websocket连接关闭时触发。连接关闭可能是由于多种原因，如服务器主动关闭、网络问题或者客户端主动调用close方法。
    • 应用场景和示例代码（以浏览器端JavaScript为例）
      • 在close事件的处理函数中，可以进行一些清理工作，比如清除定时器、释放资源或者提示用户连接已关闭。
      let socket = new WebSocket('ws://your - websocket - server - url');
socket.close()
socket.addEventListener('close', () => {console.log('Websocket connection closed.');// 清除可能存在的定时器（如心跳定时器）clearInterval(heartbeatTimer);// 提示用户let notification = document.createElement('div');notification.textContent = 'Websocket connection lost. Please try again later.';document.body.appendChild(notification);
});
  4. error事件
    • 含义和触发时机
      • error事件在Websocket连接过程中出现错误时触发。这可能是由于网络故障、服务器故障或者协议错误等原因导致的。
    • 应用场景和示例代码（以浏览器端JavaScript为例）
      • 可以在error事件处理函数中记录错误信息，尝试重新连接或者向用户显示错误提示。
      let socket = new WebSocket('ws://your - websocket - server - url');
socket.addEventListener('error', (event) => {console.error('Websocket error:', event);// 尝试重新连接reconnectWebSocket();
});

应用过程中问题总结

  1. 连接建立问题

    • 问题描述
      • 无法成功建立Websocket连接是常见的问题。可能是由于网络配置、服务器设置或者客户端代码错误导致的。例如，防火墙阻止了Websocket协议通信，或者客户端请求的URL路径错误。
    • 解决方案
      • 检查网络和防火墙：确保网络畅通，并且防火墙允许Websocket协议（通常使用的端口是80或443用于通过HTTP/HTTPS升级，或者自定义端口如8080等）的通信。在服务器端，检查安全组设置（如果是云服务器）和防火墙规则，允许传入的Websocket连接请求。
      • 检查URL和协议升级请求：在客户端代码中，仔细检查Websocket连接的URL是否正确。同时，确保请求头中包含正确的协议升级信息（如Connection: upgrade和Upgrade: websocket）。对于通过代理服务器（如Nginx）的情况，要正确配置代理服务器以支持Websocket协议升级。

  2. 连接稳定性问题

    • 问题描述
      • 连接在使用过程中频繁中断，可能是由于网络波动、服务器负载过高或者长时间没有数据传输导致连接被服务器或代理认为是空闲而关闭。
    • 解决方案
      • 实现心跳机制：在客户端和服务器端实现心跳机制，定期发送心跳包来保持连接活跃。例如，客户端每隔一定时间（如10 - 30秒）发送一个简单的心跳消息，服务器收到后回复确认消息。在服务器端（如使用Node.js的ws库）可以这样实现：
      const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', (socket) => {socket.on('message', (message) => {if (message === 'heartbeat') {socket.send('heartbeat - ack');}});
});
      • 在客户端（如浏览器中的JavaScript）：
      let socket = new WebSocket('ws://your - websocket - url');
socket.addEventListener('open', () => {setInterval(() => {socket.send('heartbeat');}, 10000); 
});
socket.addEventListener('message', (event) => {if (event.data === 'heartbeat - ack') {console.log('Heartbeat received from server');}
});
      • 优化服务器配置：检查服务器的负载情况，如CPU、内存使用率等。如果服务器负载过高，考虑增加服务器资源（如升级服务器配置或者增加服务器实例）。同时，调整服务器端的连接超时设置，使其与心跳机制相匹配，避免因为超时而错误地关闭连接。

  3. 消息传输问题

    • 问题描述
      • 消息丢失或乱序是消息传输过程中可能出现的问题。消息丢失可能是因为网络故障或者服务器处理不当，乱序可能是由于网络延迟的差异或者多线程/多进程处理导致的。
    • 解决方案
      • 消息确认机制：在客户端发送消息后，等待服务器的确认消息。如果没有收到确认消息，可以考虑重新发送。在服务器端，确保消息处理逻辑正确，并且在成功处理消息后及时发送确认消息给客户端。例如，在客户端可以设置一个消息队列和定时器，对于未收到确认的消息进行重新发送：
      let messageQueue = [];
let socket = new WebSocket('ws://your - websocket - url');
socket.addEventListener('open', () => {// 发送消息function sendMessage(message) {socket.send(message);messageQueue.push(message);}// 接收确认消息socket.addEventListener('message', (event) => {if (event.data === 'message - ack') {let sentMessage = messageQueue.shift();console.log(`Message ${sentMessage} confirmed.`);}});
});
      • 消息排序和缓存机制：如果发现消息乱序，可以在客户端和服务器端建立消息缓存和排序机制。例如，给每个消息添加一个序列号，客户端按照序列号发送消息，服务器端收到消息后按照序列号进行排序处理。

  4. 跨域问题

    • 问题描述
      • 当Websocket请求的源（Origin）与服务器的允许跨域策略不匹配时，会出现跨域问题。这是由于浏览器的同源策略限制导致的。
    • 解决方案
      • 服务器端配置跨域策略：在服务器端设置允许跨域的头信息。例如，在Node.js的Websocket服务器中，可以使用cors中间件来允许跨域请求：
      const express = require('express');
const app = express();
const http = require('http');
const server = http.createServer(app);
const { Server } = require('ws');
const wss = new Server({ server });
app.use(cors());
      • 对于其他服务器技术（如Java、Python等）也有相应的跨域处理方法，如在Java的Spring Boot中，可以通过配置@CrossOrigin注解来允许跨域的Websocket连接。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.rhkb.cn/news/478337.html

如若内容造成侵权/违法违规/事实不符，请联系长河编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

智能显示屏插座：能否成为家庭用电安全的守护天使？

智能显示屏插座：能否成为家庭用电安全的守护天使？

关键词&#xff1a;显示屏插座、LCD显示屏插座、LCD插座、智能计量插座、计量监测插座 最近&#xff0c;一则令人揪心的新闻在网络上疯传 在一个老旧小区里&#xff0c;由于电线老化和插座过载问题&#xff0c;引发了一场小型火灾。火势迅速蔓延&#xff0c;虽然幸运的是没有…
阅读更多...
SAP_MM/CO模块-超详细的CK11N/CK40N取值逻辑梳理（十几种业务场景，1.76W字）

SAP_MM/CO模块-超详细的CK11N/CK40N取值逻辑梳理（十几种业务场景，1.76W字）

一、业务背景 财务月结完成后，对次月物料进行成本发布时，经常会提物料成本不准的问题，譬如说同一个物料，CK40N发布的成本与CK11N发布的成本对不上；再有就是因为物料有多个生产版本，多个采购价格，多个货源清单等主数据，导致CK11N发布成本的时候，跟用户理解的取数逻辑对…
阅读更多...
今天你学C++了吗？——C++中的类与对象（第二集）

今天你学C++了吗？——C++中的类与对象（第二集）

♥♥♥~~~~~~欢迎光临知星小度博客空间~~~~~~♥♥♥ ♥♥♥零星地变得优秀~也能拼凑出星河~♥♥♥ ♥♥♥我们一起努力成为更好的自己~♥♥♥ ♥♥♥如果这一篇博客对你有帮助~别忘了点赞分享哦~♥♥♥ ♥♥♥如果有什么问题可以评论区留言或者私信我哦~♥♥♥ ✨✨✨✨✨✨ 个…
阅读更多...
部署实战(二)--修改jar中的文件并重新打包成jar文件

部署实战(二)--修改jar中的文件并重新打包成jar文件

一.jar文件 JAR 文件就是 Java Archive &#xff08; Java 档案文件&#xff09;&#xff0c;它是 Java 的一种文档格式JAR 文件与 ZIP 文件唯一的区别就是在 JAR 文件的内容中&#xff0c;多出了一个META-INF/MANIFEST.MF 文件META-INF/MANIFEST.MF 文件在生成 JAR 文件的时候…
阅读更多...
微信小程序+Vant-自定义选择器组件（多选

微信小程序+Vant-自定义选择器组件（多选

实现效果 无筛选&#xff0c;如有需要可参照单选组件中的方法.json文件配置"component": true,columns需要处理成含dictLabel和dictValue字段&#xff0c;我是这样处理的&#xff1a; let list arr.map(r > {return {...r,dictValue: r.xxxId,dictLabel: r.xxx…
阅读更多...
.NET Core发布网站报错 HTTP Error 500.31

.NET Core发布网站报错 HTTP Error 500.31

报错如图&#xff1a; 解决办法&#xff1a; 打开任务管理器》》服务》》找到这仨服务&#xff0c;右键启动即可&#xff0c;如果已经启动了就重启&#xff1a;
阅读更多...
Canvas 前端艺术家

Canvas 前端艺术家

目前各种数据来看&#xff0c;前端未来在 数据可视化 和 AI 这两个领域会比较香&#xff0c;而 Canvas 是 数据可视化 在前端方面的基础技术。所以给大家唠唠Canvas这个魔幻工具。 Canvas 介绍 Canvas 中文名叫 “画布”&#xff0c;是 HTML5 新增的一个标签。Canvas 允许开发…
阅读更多...
Leetcode142. 环形链表 II(HOT100)

Leetcode142. 环形链表 II(HOT100)

链接 我的错误代码&#xff1a; class Solution { public:ListNode *detectCycle(ListNode *head) {if(!head||!head->next)return nullptr;ListNode* f head->next,*s head;while(f){f f->next,s s->next;if(!f)return nullptr;f f->next;if(fs){ListNo…
阅读更多...
centos安装小火车

centos安装小火车

平时没事闲着 装个小火车玩-------->>>>> yum install sl.x86_64 启动命令 sl 就会出现以下场景
阅读更多...
JavaScript的let、var、const

JavaScript的let、var、const

这张图片主要介绍了JavaScript中的三种变量声明方式&#xff1a;let、var和const。 1. let 含义&#xff1a;let是现在实际开发中常用的变量声明方式。特点&#xff1a; 块级作用域&#xff1a;let声明的变量只在其所在的块级作用域内有效。例如&#xff1a;{let x 10; } co…
阅读更多...
替换Nacos的MySQL驱动

替换Nacos的MySQL驱动

前言&#xff1a;替换Nacos的MySQL驱动能实现使Nacos支持MySQL8.0及以上版本的MySQL数据库 注&#xff1a;下述教程会使用命令先解压Nacos的jar包然后重新用命令把Nacos压缩成jar包&#xff0c;不然直接用压缩工具替换MySQL驱动后的Nacos是会启动不起来的&#xff08;因为没有替…
阅读更多...
蓝桥杯每日真题 - 第21天

蓝桥杯每日真题 - 第21天

题目&#xff1a;(空间) 题目描述&#xff08;12届 C&C B组A题&#xff09; 解题思路&#xff1a; 转换单位&#xff1a; 内存总大小为 256MB&#xff0c;换算为字节&#xff1a; 25610241024268,435,456字节 计算每个整数占用空间&#xff1a; 每个 32 位整数占用…
阅读更多...
AI赋能电商：构建高效、智能化的新零售生态

AI赋能电商：构建高效、智能化的新零售生态

随着人工智能&#xff08;AI&#xff09;技术的不断进步&#xff0c;其在电商领域的应用日益广泛&#xff0c;从购物推荐到供应链管理&#xff0c;再到商品定价&#xff0c;AI正在全面改变传统电商的运营模式&#xff0c;并推动行业向智能化和精细化方向发展。本文将探讨如何利…
阅读更多...
Python酷库之旅-第三方库Pandas(237)

Python酷库之旅-第三方库Pandas(237)

目录 一、用法精讲 1116、pandas.tseries.offsets.BusinessHour.is_year_end方法 1116-1、语法 1116-2、参数 1116-3、功能 1116-4、返回值 1116-5、说明 1116-6、用法 1116-6-1、数据准备 1116-6-2、代码示例 1116-6-3、结果输出 1117、pandas.tseries.offsets.Cu…
阅读更多...
不一样的css(三)

不一样的css(三)

目录 一、前言 二、五角星 1.五角星&#xff0c;叠盖法&#xff1a; 2.五角星&#xff0c;拼凑法&#xff1a; 3.五角星&#xff0c;svg画法&#xff1a; 4.五角星&#xff0c;利用clip-path属性进行裁剪 三、结束语 一、前言 通过上两节的内容我们对css画小图标有了新…
阅读更多...
autogen框架中使用chatglm4模型实现react

autogen框架中使用chatglm4模型实现react

本文将介绍如何使用使用chatglm4实现react&#xff0c;利用环境变量、Tavily API和ReAct代理模式来回答用户提出的问题。 环境变量 首先&#xff0c;我们需要加载环境变量。这可以通过使用dotenv库来实现。 from dotenv import load_dotenv_ load_dotenv()注意.env文件处于…
阅读更多...
Neural Magic 发布 LLM Compressor：提升大模型推理效率的新工具

Neural Magic 发布 LLM Compressor：提升大模型推理效率的新工具

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗&#xff1f;订阅我们的简报&#xff0c;深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同&#xff0c;从行业内部的深度分析和实用指南中受益。不要错过这个机会&#xff0c;成为AI领…
阅读更多...
LabVIEW实现TCP/IP通信

LabVIEW实现TCP/IP通信

目录 1、TCP通信原理 2、硬件环境部署 3、云端环境部署 4、TCP通信函数 5、程序架构 6、前面板设计 7、程序框图设计 8、测试验证 本专栏以LabVIEW为开发平台&#xff0c;讲解物联网通信组网原理与开发方法&#xff0c;覆盖RS232、TCP、MQTT、蓝牙、Wi-Fi、NB-IoT等协议。 结合…
阅读更多...
Linux系统Docker部署开源在线协作笔记Trilium Notes与远程访问详细教程

Linux系统Docker部署开源在线协作笔记Trilium Notes与远程访问详细教程

目录 ⛳️推荐 前言 1. 安装docker与docker-compose 2. 启动容器运行镜像 3. 本地访问测试 4.安装内网穿透 5. 创建公网地址 6. 创建固定公网地址 ⛳️推荐 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下…
阅读更多...
Linux关于vim的笔记

Linux关于vim的笔记

Linux关于vim的笔记&#xff1a;(vimtutor打开vim 教程) --------------------------------------------------------------------------------------------------------------------------------- 1. 光标在屏幕文本中的移动既可以用箭头键&#xff0c;也可以使用 hjkl 字母键…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023