Ionic 中的协议缓冲区

Question

尝试使用 Ionic 4 中的协议缓冲区来编码和解码消息。曾尝试使用 protobufjs 和 google-protobuf，但都无法正常工作。

我已经下载了 protoc 并用它来生成一堆 _pb.js 文件，每个 .proto 文件一个。没关系。

首先关注 protobuf 示例。下面是示例代码：

import { load } from "protobufjs"; // respectively "./node_modules/protobufjs"

load("awesome.proto", function(err, root) {
  if (err)
    throw err;

  // example code
  const AwesomeMessage = root.lookupType("awesomepackage.AwesomeMessage");

  let message = AwesomeMessage.create({ awesomeField: "hello" });
  console.log(`message = ${JSON.stringify(message)}`);

  let buffer = AwesomeMessage.encode(message).finish();
  console.log(`buffer = ${Array.prototype.toString.call(buffer)}`);

  let decoded = AwesomeMessage.decode(buffer);
  console.log(`decoded = ${JSON.stringify(decoded)}`);
});

我做了一些更改以匹配我的文件。更改原始文件的名称。但是我的 proto 文件中没有包名。所以我只使用了消息名称。首先这是我的 .proto 文件的开始：

syntax = "proto3";

import "constants.proto";
import "wifi_constants.proto";

message CmdScanStart {
    bool blocking = 1;
    bool passive = 2;
    uint32 group_channels = 3;
    uint32 period_ms = 4;
}

message RespScanStart {

}

message CmdScanStatus {

}

message RespScanStatus {
    bool scan_finished = 1;
    uint32 result_count = 2;
}

下面是我修改后的代码：

load("../../assets/proto/wifi_scan.proto", function(err, root) {
      if (err)
      throw err;

      // example code
      const AwesomeMessage = root.lookupType("RespScanStatus");

      let message = AwesomeMessage.create({ scan_finished: 1, result_count: 31 }); // uint32 result_count
      console.log(`message = ${JSON.stringify(message)}`);

      let buffer = AwesomeMessage.encode(message).finish();
      console.log(`buffer = ${Array.prototype.toString.call(buffer)}`);

      let decoded = AwesomeMessage.decode(buffer);
      console.log(`decoded = ${JSON.stringify(decoded)}`);

    });

它似乎不起作用。我的控制台显示：

[ng] [console.log]: "message = {}"
[ng] [console.log]: "buffer = "
[ng] [console.log]: "decoded = {}"

我相信我已经确定了该文件并选择了一个有效的消息名称。但是如果我有一个引用其他原始文件的原始文件。这在运行时如何解决？我认为使用预建的 _pb.js 文件会更有意义。什么是awesomepackage？我的 proto 文件没有包！为什么不断提到令人敬畏的事情？不太好：令人困惑！

这段代码看起来可以直接使用 .proto 文件。但是您不需要 protoc 来执行此操作吗？这不一定可用。如果您知道发生了什么，这似乎很明显，但对我来说并没有完全融合在一起。请帮忙。

Answer 1

一个可能的答案是使用 google-protobuf。见https://github.com/protocolbuffers/protobuf/tree/master/js

$ npm install google-protobug --save

现在根据问题，使用 protoc 生成一组 _pb.js 文件。运行命令时选择常见的 JS 导入样式，以便下一步与您的输出保持一致：

$ protoc --proto_path=./proto-src-wifi/ --js_out=import_style=commonjs,binary:./proto-js ./proto-src-wifi/wifi_scan.proto

这将创建一个 _pb.js 文件，您现在可以在 Angular 项目中使用该文件。我发现这样的东西可以很好地一次生成堆：

$ protoc --proto_path=./proto-src-wifi/ --js_out=import_style=commonjs,binary:./proto-js ./proto-src-wifi/*.proto

您可以像这样为 wifi_scan_pb 导入它们：

    console.log('armpit!'); 
    var messages = require("../../assets/js/wifi_scan_pb");
    var message = new messages.RespScanStatus();
    message.setScanFinished(true);
    message.setResultCount(31);
    var bytesOfStuff = message.serializeBinary();
    console.log(`bytesOfStuff = ${JSON.stringify(bytesOfStuff)}`); 

    var messageRecovered = messages.RespScanStatus.deserializeBinary(bytesOfStuff);
    console.log(`Recovered Scan finished = ${messageRecovered.array[0]}`);
    console.log(`Recovered Scan Result Count = ${messageRecovered.array[1]}`);

您需要检查 _pb 文件以获取您需要为正在构建的对象中的每个条目使用的方法的确切名称：'setScanFinished' 或其他...

及以上组件：

declare var require: any;

干得好！