【小沐学前端】Node.js实现UDP和Protobuf 通信（protobuf.js）

文章目录

1、简介
- 1.1 node
- 1.2 Protobuf
2、下载和安装
- 2.1 node
- 2.2 Protobuf
3、node 代码示例
- 3.1 HTTP
- 3.2 UDP单播
- 3.4 UDP广播
4、Protobuf 代码示例
- 4.1 例子:awesome.proto
结语

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 中的库是使用非阻塞范例编写的，这使得阻塞行为成为异常而不是常态。
https://img-blog.csdnimg.cn/164ae5742e16474488ef4d1c66b3279f.png" alt="在这里插入图片描述" />

1.2 Protobuf

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

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

https://img-blog.csdnimg.cn/35a655b6ac804b22b64f11c3921b4d3a.png" alt="在这里插入图片描述" />
Google Protocol Buffer( 简称 Protobuf) 是 Google 公司内部的混合语言数据标准，目前已经正在使用的有超过 48,162 种报文格式定义和超过 12,183 个 .proto 文件。他们用于 RPC 系统和持续数据存储系统。
https://img-blog.csdnimg.cn/7f20d9b12a8c40deaf8b6b5550ea1702.png" alt="在这里插入图片描述" />

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

2、下载和安装

2.1 node

https://nodejs.org/zh-cn
https://img-blog.csdnimg.cn/12db9345d6ab46e5bee92b750a5a23f1.png" alt="在这里插入图片描述" />
https://nodejs.org/zh-cn/download
https://img-blog.csdnimg.cn/30b561bc6f764409b9642dabaf3217d7.png" alt="在这里插入图片描述" />

2.2 Protobuf

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

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=~]

#老版本
##使用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

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

https://img-blog.csdnimg.cn/b0b119de4f354e6c9e73511e69afdd8b.png" alt="在这里插入图片描述" />
浏览器访问http服务器：

http://127.0.0.1:3000/

https://img-blog.csdnimg.cn/08df04ee153f498e82aa58eb3de7dde8.png" alt="在这里插入图片描述" />

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}/`);

https://img-blog.csdnimg.cn/4bd76c05e28d43e29a295237329ccb24.png" alt="在这里插入图片描述" />

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);

https://img-blog.csdnimg.cn/fc70bfc94f1e496f9555c11e9b958cc3.png" alt="在这里插入图片描述" />

客户端：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();
});

https://img-blog.csdnimg.cn/fa1f54b99f38454fa617fd7b4d780677.png" alt="在这里插入图片描述" />

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);

https://img-blog.csdnimg.cn/3f12ad7a9e664e2faced18b28efa2d91.png" alt="在这里插入图片描述" />

客户端：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);
    
});

https://img-blog.csdnimg.cn/9573950b6f3d4106a5d0a250bfb76ced.png" alt="在这里插入图片描述" />

4、Protobuf 代码示例

4.1 例子:awesome.proto

awesome.proto的内容定义如下：

// awesome.proto
package awesomepackage;
syntax = "proto3";

message AwesomeMessage {
    string awesome_field = 1; // becomes awesomeField
}

测试脚本文件：test_proto.js

var protobuf = require("protobufjs");
protobuf.load("awesome.proto", function(err, root) {
    if (err)
        throw err;

    // Obtain a message type
    var AwesomeMessage = root.lookupType("awesomepackage.AwesomeMessage");

    // Exemplary payload
    var 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 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));
});

执行运行命令如下：

node test_proto.js

https://img-blog.csdnimg.cn/6a6263d0651b47ed8b23696086e1bff6.png" alt="在这里插入图片描述" />

结语

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