【小沐学前端】Node.js实现基于Protobuf协议的UDP通信(UDP/TCP)

文章目录

  • 1、简介
    • 1.1 node
    • 1.2 Protobuf
  • 2、下载和安装
    • 2.1 node
    • 2.2 Protobuf
      • 2.2.1 安装
      • 2.2.2 工具
  • 3、node 代码示例
    • 3.1 HTTP
    • 3.2 UDP单播
    • 3.4 UDP广播
  • 4、Protobuf 代码示例
    • 4.1 例子: awesome.proto
      • 4.1.1 加载.proto文件方式
      • 4.1.2 加载.json文件方式
      • 4.1.3 加载.js文件方式
    • 4.2 例子:account.proto
      • 4.2.1 create(...)创建对象
      • 4.2.2 fromObject(...)创建对象
    • 4.3 例子:hello.proto + udp
      • 4.3.1 服务端:yxy_server.js
      • 4.3.2 客户端:yxy_client.js
    • 4.4 例子:user.proto + tcp
      • 4.4.1 服务端:yxy_tcpserver.js
      • 4.4.2 客户端:yxy_tcpclient.js
  • 结语

1、简介

1.1 node

Node.js 是一个开源的、跨平台的 JavaScript 运行时环境。

Node.js 是一个开源和跨平台的 JavaScript 运行时环境。 它是几乎任何类型项目的流行工具!

Node.js 在浏览器之外运行 V8 JavaScript 引擎(Google Chrome 的内核)。 这使得 Node.js 非常高效。

Node.js 应用在单个进程中运行,无需为每个请求创建新线程。 Node.js 在其标准库中提供了一组异步 I/O 原语,以防止 JavaScript 代码阻塞,并且通常,Node.js 中的库是使用非阻塞范例编写的,这使得阻塞行为成为异常而不是常态。
在这里插入图片描述

1.2 Protobuf

Protobuf 是一种用于 序列化 和 反序列化 对象的格式规范(rpc 通信协议)。

Protobuf 与 非结构化格式(如 JSON、XML)最大的区别在于,你必须为 protobufs 定义数据类型,最常用的方式是定义 .proto 文件。

在这里插入图片描述
Google Protocol Buffer( 简称 Protobuf) 是 Google 公司内部的混合语言数据标准,目前已经正在使用的有超过 48,162 种报文格式定义和超过 12,183 个 .proto 文件。他们用于 RPC 系统和持续数据存储系统。
在这里插入图片描述

Google Protocol Buffers 是一种轻便高效的结构化数据存储格式,可以用于结构化数据串行化,或者说序列化。它很适合做数据存储或 RPC 数据交换格式。可用于通讯协议、数据存储等领域的语言无关、平台无关、可扩展的序列化结构数据格式。目前提供了 C++、Java、Python 三种语言的 API(即时通讯网注:Protobuf官方工程主页上显示的已支持的开发语言多达10种,分别有:C++、Java、Python、Objective-C、C#、JavaNano、JavaScript、Ruby、Go、PHP,基本上主流的语言都已支持.
在这里插入图片描述

2、下载和安装

2.1 node

https://nodejs.org/zh-cn
在这里插入图片描述
https://nodejs.org/zh-cn/download
在这里插入图片描述

2.2 Protobuf

https://github.com/protocolbuffers/protobuf
https://github.com/protobufjs/protobuf.js
https://protobufjs.github.io/protobuf.js/

protobuf.js是一个纯JavaScript实现,支持Node.js和浏览器的TypeScript,它容易使用速度快速,可以直接反射.proto文件,不需要生成任何文件。

protobuf.js是基于ByteBuffer.js的Protocol Buffers纯JavaScript实现,主要功能是解析.proto文件,构建Message类,编码解码。

2.2.1 安装

npm install protobufjs [--save --save-prefix=~]
npm i -g protobufjs# The command line utility lives in the protobufjs-cli package and must be installed separately:
npm install protobufjs-cli [--save --save-prefix=~]

2.2.2 工具

https://protobufjs.github.io/protobuf.js/#pbjs-for-javascript

#老版本
##使用pbjs命令将.proto文件转换为.js文件
./node_modules/protobufjs/bin/pbjs -t json msg.proto > msg.json## 使用pbjs命令将.proto文件转换为.json文件
./node_modules/protobufjs/bin/pbjs -t static_module -w commonjs -o msg.js msg.proto#新版本
npx pbjs  -t json message.proto --es6 "msg.js"
npx pbjs  -t json message.proto --ts "msg.ts" 

而在node端,也可以打包成js文件来处理。但node端是服务端环境了,完全可以允许.proto的存在,所以其实我们可以有优雅的使用方式:直接解析。

使用pbjs命令将.proto文件转换为.json文件:

./node_modules/protobufjs/bin/pbjs -t json msg.proto > msg.json
./protobuf.js-protobufjs-v7.2.5/cli/bin/pbjs  -t json msg.proto > msg.json

在这里插入图片描述

  • 命令行参数如下:
  -t, --target     Specifies the target format. Also accepts a path to require a custom target.json          JSON representationjson-module   JSON representation as a moduleproto2        Protocol Buffers, Version 2proto3        Protocol Buffers, Version 3static        Static code without reflection (non-functional on its own)static-module Static code without reflection as a module-p, --path       Adds a directory to the include path.-o, --out        Saves to a file instead of writing to stdout.--sparse         Exports only those types referenced from a main file (experimental).Module targets only:-w, --wrap       Specifies the wrapper to use. Also accepts a path to require a custom wrapper.default   Default wrapper supporting both CommonJS and AMDcommonjs  CommonJS wrapperamd       AMD wrapperes6       ES6 wrapper (implies --es6)closure   A closure adding to protobuf.roots where protobuf is a global-r, --root       Specifies an alternative protobuf.roots name.-l, --lint       Linter configuration. Defaults to protobuf.js-compatible rules:eslint-disable block-scoped-var, no-redeclare, no-control-regex, no-prototype-builtins--es6            Enables ES6 syntax (const/let instead of var)Proto sources only:--keep-case      Keeps field casing instead of converting to camel case.Static targets only:--no-create      Does not generate create functions used for reflection compatibility.--no-encode      Does not generate encode functions.--no-decode      Does not generate decode functions.--no-verify      Does not generate verify functions.--no-convert     Does not generate convert functions like from/toObject--no-delimited   Does not generate delimited encode/decode functions.--no-beautify    Does not beautify generated code.--no-comments    Does not output any JSDoc comments.--force-long     Enfores the use of 'Long' for s-/u-/int64 and s-/fixed64 fields.--force-message  Enfores the use of message instances instead of plain objects.usage: pbjs [options] file1.proto file2.json ...  (or pipe)  other | pbjs [options] -

3、node 代码示例

3.1 HTTP

一旦你已经安装了 Node,让我们尝试构建第一个 Web 服务器。然后使用 node server.js 运行程序,访问 http://localhost:3000,你就会看到一个消息,写着“Hello World”。

  • server.js
const http = require('http');
const hostname = '127.0.0.1';
const port = 3000;const server = http.createServer((req, res) => {res.statusCode = 200;res.setHeader('Content-Type', 'text/plain;charset=utf-8');res.end('Hello World, 爱看书的小沐!2023!\n');
});server.listen(port, hostname, () => {console.log(`服务器运行在 http://${hostname}:${port}/`);
});

运行脚本:

node server.js

在这里插入图片描述
浏览器访问http服务器:

http://127.0.0.1:3000/

在这里插入图片描述

var http = require('http');
var hostname = '127.0.0.1';
var port = 3000;http.createServer(function(req, res) {res.writeHead(200, {'Content-Type': 'text/html'});res.write('<head><meta charset="utf-8"/></head>');res.write('<h1>Node.js</h1>');res.write('<b>爱看书的小沐!2023!</b>');res.end('<p>Hello World</p>');}).listen(port);console.log("HTTP server is listening at port ${port}.");
console.log(`服务器运行在 http://${hostname}:${port}/`);

在这里插入图片描述

3.2 UDP单播

UDP单播例子一

  • 制作一个文件 (“demo_dgram.js”) 监听 8080 端口上的消息:
var dgram = require('dgram');
var s = dgram.createSocket('udp4');
s.on('message', function(msg, rinfo) {console.log('I got this message: ' + msg.toString());
});
s.bind(8080);
  • 制作一个向 8080 端口发送消息的文件(“demo_dgram_send.js”) :
var dgram = require('dgram');
var s = dgram.createSocket('udp4');
s.send(Buffer.from('abc'), 8080, 'localhost');

UDP单播例子二

  • 服务器:udp_server.js
// 例子:UDP服务端
var PORT = 9090;
var HOST = '127.0.0.1';var dgram = require('dgram');
var server = dgram.createSocket('udp4');server.on('listening', function () {var address = server.address();console.log('UDP Server listening on ' + address.address + ":" + address.port);
});server.on('message', function (message, remote) {console.log(remote.address + ':' + remote.port +' - ' + message);
});server.bind(PORT, HOST);

在这里插入图片描述

  • 客户端:udp_client.js
// 例子:UDP客户端
var PORT = 9090;
var HOST = '127.0.0.1';var dgram = require('dgram');
var message = Buffer.from('This is 爱看书的小沐!');var client = dgram.createSocket('udp4');client.send(message, PORT, HOST, function(err, bytes) {if (err) throw err;console.log('UDP message sent to ' + HOST +':'+ PORT);client.close();
});

在这里插入图片描述

3.4 UDP广播

  • 服务器:boardcast_server.js
var dgram = require('dgram');
var server = dgram.createSocket('udp4');
var port = 8080;server.on('message', function(message, rinfo){console.log('server got message from: ' + rinfo.address + ':' + rinfo.port);
});server.on('listening', function () {var address = server.address();console.log('Boardcast Server listening on ' + address.address + ":" + address.port);
});server.bind(port);

在这里插入图片描述

  • 客户端:boardcast_client.js
var dgram = require('dgram');
var client = dgram.createSocket('udp4');
var msg = Buffer.from('hello world, 爱看书的小沐!');
var port = 8080;
var host = '255.255.255.255';client.bind(function(){client.setBroadcast(true);// client.send(msg, port, host, function(err){//     if(err) throw err;//     console.log('msg has been sent');//     client.close();// });// 循环发送消息setInterval(function(){client.send(msg, port, host, function(err){if(err) throw err;console.log('msg has been sent');});}, 1000);});

在这里插入图片描述

4、Protobuf 代码示例

4.1 例子: awesome.proto

  • awesome.proto的内容定义如下:
// awesome.proto
package awesomepackage;
syntax = "proto3";message AwesomeMessage {string awesome_field = 1; // becomes awesomeFieldstring name_field = 2;
}

4.1.1 加载.proto文件方式

  • 测试脚本文件:app_proto001.js
var protobuf = require("protobufjs");protobuf.load("awesome.proto", function(err, root) {if (err)throw err;var AwesomeMessage = root.lookupType("awesomepackage.AwesomeMessage");var payload = { awesomeField: "AwesomeString" };var message = AwesomeMessage.create(payload); var buffer = AwesomeMessage.encode(message).finish();
});
var protobuf = require("protobufjs");protobuf.load("awesome.proto", function(err, root) {if (err)throw err;// Obtain a message typevar AwesomeMessage = root.lookupType("awesomepackage.AwesomeMessage");// Exemplary payloadvar payload = { awesomeField: "AwesomeString" };console.log("payload: " + JSON.stringify(payload));// Verify the payload if necessary (i.e. when possibly incomplete or invalid)var errMsg = AwesomeMessage.verify(payload);if (errMsg)throw Error(errMsg);// Create a new messagevar message = AwesomeMessage.create(payload); // or use .fromObject if conversion is necessaryconsole.log("create: " + JSON.stringify(message));// Encode a message to an Uint8Array (browser) or Buffer (node)var buffer = AwesomeMessage.encode(message).finish();// ... do something with bufferconsole.log("encode: " + JSON.stringify(buffer));// Decode an Uint8Array (browser) or Buffer (node) to a messagevar message = AwesomeMessage.decode(buffer);// ... do something with messageconsole.log("decode: " + JSON.stringify(message));// If the application uses length-delimited buffers, there is also encodeDelimited and decodeDelimited.// Maybe convert the message back to a plain objectvar object = AwesomeMessage.toObject(message, {longs: String,enums: String,bytes: String,// see ConversionOptions});console.log("toObject: " + JSON.stringify(object));
});

执行运行命令如下:

node app_proto001.js

在这里插入图片描述

4.1.2 加载.json文件方式

执行如下命令,将awesome.proto转为awesome.json:

./node_modules/protobufjs/bin/pbjs -t json awesome.proto > awesome.json

自动生成的awesome.json如下:

{"nested": {"awesomepackage": {"nested": {"AwesomeMessage": {"fields": {"awesomeField": {"type": "string","id": 1},"nameField": {"type": "string","id": 2}}}}}}
}

编写脚本代码如下:

var protobuf = require("protobufjs");var jsonDescriptor = require("./awesome.json"); // exemplary for nodevar root = protobuf.Root.fromJSON(jsonDescriptor);// Obtain a message type
var AwesomeMessage = root.lookupType("awesomepackage.AwesomeMessage");// Exemplary payload
var payload = { awesomeField: "AwesomeString", nameField: "AwesomeName"};
console.log("payload: " + JSON.stringify(payload));// Verify the payload if necessary (i.e. when possibly incomplete or invalid)
var errMsg = AwesomeMessage.verify(payload);
if (errMsg)throw Error(errMsg);// Create a new message
var message = AwesomeMessage.create(payload); // or use .fromObject if conversion is necessary
console.log("create: " + JSON.stringify(message));// Encode a message to an Uint8Array (browser) or Buffer (node)
var buffer = AwesomeMessage.encode(message).finish();
// ... do something with buffer
console.log("encode: " + JSON.stringify(buffer));// Decode an Uint8Array (browser) or Buffer (node) to a message
var message = AwesomeMessage.decode(buffer);
// ... do something with message
console.log("decode: " + JSON.stringify(message));// If the application uses length-delimited buffers, there is also encodeDelimited and decodeDelimited.// Maybe convert the message back to a plain object
var object = AwesomeMessage.toObject(message, {longs: String,enums: String,bytes: String,// see ConversionOptions
});
console.log("toObject: " + JSON.stringify(object));

运行结果如下:
在这里插入图片描述

4.1.3 加载.js文件方式

通过如下命令转为.proto为对应的.js文件

C:\Users\tomcat\Desktop\test>C:\Users\tomcat\Desktop\protobuf.js-protobufjs-v7.2.5\node_modules\.bin\pbjs  -t static-module -w commonjs -o awesome.js awesome.proto

生成的awesome.js 部分内容如下:
在这里插入图片描述
编写测试脚本代码如下:

var protobuf = require("protobufjs");var awesomeProto = require("./awesome.js"); // exemplary for node
var AwesomeUtils = awesomeProto.awesomepackage.AwesomeMessage;// Exemplary payload
var payload = { awesomeField: "AwesomeString", nameField: "AwesomeName"};
console.log("payload: " + JSON.stringify(payload));// Verify the payload if necessary (i.e. when possibly incomplete or invalid)
var errMsg = AwesomeUtils.verify(payload);
if (errMsg)throw Error(errMsg);// Create a new message
var message = AwesomeUtils.create(payload); // or use .fromObject if conversion is necessary
console.log("create: " + JSON.stringify(message));// Encode a message to an Uint8Array (browser) or Buffer (node)
var buffer = AwesomeUtils.encode(message).finish();
// ... do something with buffer
console.log("encode: " + JSON.stringify(buffer));// Decode an Uint8Array (browser) or Buffer (node) to a message
var message = AwesomeUtils.decode(buffer);
// ... do something with message
console.log("decode: " + JSON.stringify(message));// If the application uses length-delimited buffers, there is also encodeDelimited and decodeDelimited.// Maybe convert the message back to a plain object
var object = AwesomeUtils.toObject(message, {longs: String,enums: String,bytes: String,// see ConversionOptions
});
console.log("toObject: " + JSON.stringify(object));

运行脚本文件如下:

node app_awesome.js

在这里插入图片描述

4.2 例子:account.proto

  • account.proto
// account.proto
package yxy;
syntax = "proto3";message Account{required string name = 1; //帐号名required string pwd = 2; //帐号密码
}message AccountList{required int32 index = 1;repeated Account list = 2;
}

4.2.1 create(…)创建对象

  • app_account.js
var ProtoBufJs = require("protobufjs");
var root = ProtoBufJs.loadSync("./account.proto");
var AccountList = root.lookupType("yxy.AccountList");
var Account = root.lookupType("yxy.Account");
var accountListObj = AccountList.create();for(var i = 0; i < 10; i++){var accountObj = Account.create();accountObj.name = "杨小羊_"+i;accountObj.pwd = "pwd_"+i;accountListObj.list.push(accountObj);
}var buffer = AccountList.encode(accountListObj).finish();console.log("data: " + JSON.stringify(accountListObj));
console.log("encode: " + JSON.stringify(buffer));

执行命令如下:

node app_account.js

在这里插入图片描述

4.2.2 fromObject(…)创建对象

var ProtoBufJs = require("protobufjs");
var root = ProtoBufJs.loadSync("./account.proto");
var AccountList = root.lookupType("yxy.AccountList");
var Account = root.lookupType("yxy.Account");var accountObj1 = Account.fromObject({pwd:"666", name:"杨小羊"});
var accountObj2 = Account.fromObject({pwd:"777", name:"杨大羊"});
var accountObj3 = Account.fromObject({pwd:"888", name:"杨胖羊"});
var accountListObj = AccountList.fromObject({index:"0", list:[accountObj1,accountObj2,accountObj3]});
var buffer = AccountList.encode(accountListObj).finish();console.log("data: " + JSON.stringify(accountListObj));
console.log("encode: " + JSON.stringify(buffer));

执行结果如下:
在这里插入图片描述

4.3 例子:hello.proto + udp

  • hello.proto
package yxy;
message helloworld
{message helloReq { required string name = 1; }message helloRsp{required int32 retcode = 1;optional string reply = 2;}
}

4.3.1 服务端:yxy_server.js

  • yxy_server.js
var ProtoBuf = require("protobufjs");
var dgram = require('dgram');
var PORT = 8080;
var HOST = '127.0.0.1';var server = dgram.createSocket('udp4');
var root = ProtoBuf.loadSync("./hello.proto");
var HelloReq = root.lookupType("yxy.helloworld.helloReq");
var HelloRsp = root.lookupType("yxy.helloworld.helloRsp");server.on('listening', function () {var address = server.address();console.log('UDP Server listening on ' + address.address + ":" + address.port);
});server.on('message', function (message, remote) {console.log(remote.address + ':' + remote.port + ' - ' + message);console.log(HelloReq.decode(message) + ' from client!');var hCReq = HelloRsp.fromObject({retcode:200, reply:'Yeah!I\'m 杨小羊!'});var message = HelloRsp.encode(hCReq).finish();server.send(message, 0, message.length, remote.port, remote.address, function (err, bytes) {if (err) {throw err;}console.log('UDP message reply to ' + remote.address + ':' + remote.port);})
});server.bind(PORT, HOST);

在这里插入图片描述

4.3.2 客户端:yxy_client.js

var dgram = require('dgram');
var ProtoBuf = require("protobufjs");
var PORT = 8080;
var HOST = '127.0.0.1';var root = ProtoBuf.loadSync("./hello.proto");
var HelloReq = root.lookupType("yxy.helloworld.helloReq");
var HelloRsp = root.lookupType("yxy.helloworld.helloRsp");var hCReq = HelloReq.fromObject({name:"杨小羊"});
var buffer = HelloReq.encode(hCReq).finish();
message = buffer; var socket = dgram.createSocket({type: 'udp4',fd: PORT
}, function (err, message) {if (err) {console.log(err);}console.log(message);
});socket.send(message, 0, message.length, PORT, HOST, function (err, bytes) {if (err) {throw err;}console.log('UDP message sent to ' + HOST + ':' + PORT);
});socket.on("message", function (msg, rinfo) {console.log("[Client] Received message: " + HelloRsp.decode(msg).reply + " from " + rinfo.address + ":" + rinfo.port);console.log(HelloRsp.decode(msg));socket.close();
});socket.on('close', function () {console.log('socket closed.');
});socket.on('error', function (err) {socket.close();console.log('socket err');console.log(err);
});

在这里插入图片描述

4.4 例子:user.proto + tcp

  • user.proto
syntax = "proto3";
package yxy;message Login {required string name = 1;required string pwd = 2;
}
message Address{string province = 1;string city = 2;string country = 3;
}

4.4.1 服务端:yxy_tcpserver.js

  • yxy_tcpserver.js
const net = require("net");
const protobuf = require("protobufjs");
const PORT = 9090;
const HOST = '127.0.0.1';protobuf.load("./user.proto", (err, root) => {if (err) throw err;const LoginMessage = root.lookupType("yxy.Login");const server = net.createServer((socket) => {console.log("New client connected");socket.on("data", (data) => {// 解码数据 const message = LoginMessage.decode(data);// 在这里处理消息console.log(message);// 编码响应 const responseData = LoginMessage.encode({name: "杨小羊",pwd: "123456"}).finish();// 将响应写回到连接 socket.write(responseData);});socket.on("close", () => {console.log("Client disconnected");});});server.listen(PORT, () => {console.log(`Server listening on localhost:${PORT}`);});
});

在这里插入图片描述

4.4.2 客户端:yxy_tcpclient.js

  • yxy_tcpclient.js
const net = require("net");
const protobuf = require("protobufjs");
const PORT = 9090;
const HOST = '127.0.0.1';protobuf.load("./user.proto", (err, root) => {if (err) throw err;const LoginMessage = root.lookupType("yxy.Login");const client = net.createConnection({port: PORT}, () => {console.log("Connected to server");// 编码数据 const data = LoginMessage.encode({name: "爱看书的小沐",pwd: "666666"}).finish();// 将数据写到连接 client.write(data);});client.on("data", (data) => {// 解码服务器的响应 const message = LoginMessage.decode(data);// 在这里处理响应 console.log(message);});client.on("close", () => {console.log("Connection closed");});
});

在这里插入图片描述

结语

如果您觉得该方法或代码有一点点用处,可以给作者点个赞,或打赏杯咖啡;╮( ̄▽ ̄)╭
如果您感觉方法或代码不咋地//(ㄒoㄒ)//,就在评论处留言,作者继续改进;o_O???
如果您需要相关功能的代码定制化开发,可以留言私信作者;(✿◡‿◡)
感谢各位大佬童鞋们的支持!( ´ ▽´ )ノ ( ´ ▽´)っ!!!

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

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

idea Springboot在线商城系统VS开发mysql数据库web结构java编程计算机网页源码maven项目

一、源码特点 springboot 在线商城系统是一套完善的信息系统&#xff0c;结合springboot框架和bootstrap完成本系统&#xff0c;对理解JSP java编程开发语言有帮助系统采用springboot框架&#xff08;MVC模式开发&#xff09;&#xff0c;系统具有 完整的源代码和数据库&…

多目标平衡优化器黏菌算法(MOEOSMA)求解CEC2020多模式多目标优化

多目标平衡优化器黏菌算法&#xff08;MOEOSMA&#xff09;比现有的多目标黏菌算法具有更好的优化性能。在MOEOSMA中&#xff0c;动态系数用于调整勘探和开采趋势。采用精英存档机制来促进算法的收敛性。使用拥挤距离法来保持Pareto前沿的分布。采用平衡池策略模拟黏菌的协同觅…

Redis持久化、主从与哨兵架构详解

文章目录 一、RDB、AOF及混合持久化详解RDB快照&#xff08;snapshot&#xff09;bgsave的写时复制(COW)机制save与bgsave对比&#xff1a; AOF&#xff08;append-only file&#xff09;AOF重写 RDB 和 AOF &#xff0c;我应该用哪一个&#xff1f;Redis 4.0 混合持久化 二、R…

IDEA的使用

文章目录 1.IDEA配置1.1 idea界面说明1.2 git1.3 JDK1.4 maven1.5 Tomcat1.6 idea设置编码格式1.7 vscodenodejs1.8 windows下安装redis 2. IDEA问题2.1 setAttribute方法爆红2.2 idea cannot download sources解决办法2.3 springboot项目跑起来不停run 3. vscode3.1 vscode显示…

springcloud:四、nacos介绍+启动+服务分级存储模型/集群+NacosRule负载均衡

nacos介绍 nacos是阿里巴巴提供的SpringCloud的一个组件&#xff0c;算是eureka的替代品。 nacos启动 安装过程这里不再赘述&#xff0c;相关安装或启动的问题可以见我的另一篇博客&#xff1a; http://t.csdn.cn/tcQ76 单价模式启动命令&#xff1a;进入bin目录&#xff0…

Ant-Design-Vue:a-range-picker组件国际化配置

在使用Ant-Design-Vue中的时间范围选择器开发个人项目时&#xff0c;发现默认显示为英文。如何解决呢&#xff1f; date-picker分类 Antd-Vue提供了DatePicker、MonthPicker、RangePicker、WeekPicker 几种类型的时间选择器&#xff0c;分别用于选择日期、月份、日期范围、周范…

win10系统任务栏图标变成白色的解决办法

我平时都是用滴答清单进行管理这个自己的日程代办的&#xff0c;但是今天打开的时候发现这个快捷方式突然变成纯白色的了&#xff0c;重启电脑之后&#xff0c;这个图标的样式仍然没有变化。上网查找解决办法之后&#xff0c;终于搞好了&#xff0c;于是就有了下面的教程。 为什…

Android studio “Layout Inspector“工具在Android14 userdebug设备无法正常使用

背景描述 做rom开发的都知道&#xff0c;“Layout Inspector”和“Attach Debugger to Android Process”是studio里很好用的工具&#xff0c;可以用来查看布局、调试系统进程&#xff08;比如setting、launcher、systemui&#xff09;。 问题描述 最进刚开始一个Android 14…

(Note)机器学习面试题

机器学习 1.两位同事从上海出发前往深圳出差&#xff0c;他们在不同时间出发&#xff0c;搭乘的交通工具也不同&#xff0c;能准确描述两者“上海到深圳”距离差别的是&#xff1a; A.欧式距离 B.余弦距离 C.曼哈顿距离 D.切比雪夫距离 S:D 1. 欧几里得距离 计算公式&#x…

机器学习之SGD, Batch, and Mini Batch的简单介绍

文章目录 总述SGD(Stochastic Gradient Descent)(随机梯度下降&#xff09;Batch &#xff08;批量&#xff09;mini Batch (迷你批量&#xff09; 总述 SGD, Batch, and Mini Batch是可用于神经网络的监督学习计算权重更新的方案&#xff0c;即∆wij。 SGD(Stochastic Gradi…

【STM32】IAP升级03关闭总中断,检测栈顶指针

IAP升级方法 IAP升级时需要关闭总中断 TM32在使用时有时需要禁用全局中断&#xff0c;比如MCU在升级过程中需禁用外部中断&#xff0c;防止升级过程中外部中断触发导致升级失败。 ARM MDK中提供了如下两个接口来禁用和开启总中断&#xff1a; __disable_irq(); // 关闭总中…

emacs怎么安装插件

2023年9月26日&#xff0c;周二下午 不得不说&#xff0c;emacs安装插件确实要比vim要方便 虽然我曾经说过要只用vim&#xff0c;但vim安装插件起来太麻烦了 目录 Linux下Emacs的配置文件位置包管理器elpa怎么给elpa换源罗列可安装的插件怎么搜索插件怎么安装插件配置插件 L…

什么是FOSS

FOSS 是指 自由和开放源码软件(Free and Open Source Software)。这并不意味着软件是免费的。它意味着软件的源代码是开放的&#xff0c;任何人都可以自由使用、研究和修改代码。这个原则允许人们像一个社区一样为软件的开发和改进做出贡献。

CentOS密码重置

背景&#xff1a; 我有一个CentOS虚拟机&#xff0c;但是密码忘记了&#xff0c;偶尔记起可以重置密码&#xff0c;于是今天尝试记录一下&#xff0c;又因为我最近记性比较差&#xff0c;所以必须要记录一下。 过程&#xff1a; 1、在引导菜单界面&#xff08;grub&#xff…

如何实现电脑语音输入功能?

现在的手机都具备语音输入功能&#xff0c;并且识别率非常高&#xff0c;语音输入是目前最快速的文字输入方式&#xff0c;但是电脑上却无语音输入的功能&#xff0c;那么如何实现在电脑端也可进行语音输入的梦想呢&#xff1f;现在介绍一款小工具“书剑电脑语音输入法”&#…

java并发编程 守护线程 用户线程 main

经常使用线程&#xff0c;没有对守护线程和用户线程的区别做彻底了解 下面写4个例子来验证一下 源码如下 /* Whether or not the thread is a daemon thread. */ private boolean daemon false;/*** Marks this thread as either a {linkplain #isDaemon daemon} thread*…

Python|OpenCV-如何给目标图像添加边框(7)

前言 本文是该专栏的第7篇,后面将持续分享OpenCV计算机视觉的干货知识,记得关注。 在使用opencv处理图像的时候,会不可避免的对图像的一些具体区域进行一些操作。比如说,想要给目标图像创建一个围绕图像的边框。简单的来说,就是在图片的周围再填充一个粗线框。具体效果,…

OpenCV实现视频的读取、显示、保存

目录 1&#xff0c;从文件中读取视频并播放 1.2代码实现 1.3效果展示 2&#xff0c;保存视频 2.1 代码实现 2.2 结果展示 1&#xff0c;从文件中读取视频并播放 在OpenCV中我们需要获取一个视频&#xff0c;需要创建一个VideoCapture对象,指定你要读取的视频文件&am…

uni-app 实现凸起的 tabbar 底部导航栏

效果图 在 pages.json 中设置隐藏自带的 tabbar 导航栏 "custom": true, // 开启自定义tabBar(不填每次原来的tabbar在重新加载时都回闪现) 新建一个 custom-tabbar.vue 自定义组件页面 custom-tabbar.vue <!-- 自定义底部导航栏 --> <template><v…

【图像处理】【应用程序设计】加载,编辑和保存图像数据、图像分割、色度键控研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…