前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >protobuf基于java和javascript的使用

protobuf基于java和javascript的使用

作者头像
陈灬大灬海
发布2021-03-17 17:04:12
1.9K0
发布2021-03-17 17:04:12
举报

ProtoBuf介绍

ProtoBuf 是google团队开发的用于高效存储和读取结构化数据的工具,google出品,必属精品。 目前最新版本为3。文档地址:https://developers.google.com/protocol-buffers/docs/proto3 相比于xmljsonprotobuf压缩率更高,传输高效,自然很节省流量。 protobuf支持跨语言,貌似前后端使用javaJavaScript的众多吧。

整理下java和JavaScript的例子

需要下载protoc可执行文件。通过编写.proto,命令生成相应的文件,比如java,js等。

编写Person.proto。 具体语法可以查看官网,这是最基础的一个对象。

代码语言:javascript
复制
syntax = "proto3";
option java_package = "com.dahai.protobuf";
option java_outer_classname = "PersonModel";

message Person {
  int32 id = 1;
  string name = 2;
  int32 age = 3;
  string email = 4;
}

可以通过protoc命令生成,此处为了方便起见,使用maven plugin来生成(原理一直,会下载相应的protoc可执行文件)

创建maven工程,在resources目录创建proto文件夹,将示例文件Person.proto放入改文件夹下。

pom.xml引入相应依赖

代码语言:javascript
复制
    <dependency>
      <groupId>com.google.protobuf</groupId>
      <artifactId>protobuf-java</artifactId>
      <version>3.11.1</version>
    </dependency>

pom.xml引入相应的插件

代码语言:javascript
复制
  <build>
    <extensions>
      <extension>
        <groupId>kr.motd.maven</groupId>
        <artifactId>os-maven-plugin</artifactId>
        <version>1.6.2</version>
      </extension>
    </extensions>
    <plugins>
      <plugin>
        <groupId>org.xolstice.maven.plugins</groupId>
        <artifactId>protobuf-maven-plugin</artifactId>
        <version>0.6.1</version>
        <extensions>true</extensions>
        <configuration>
        <!--指定项目的proto文件目录-->
          <protoSourceRoot>src/main/resources/proto</protoSourceRoot>
          <clearOutputDirectory>false</clearOutputDirectory>
          <!--不存在会自动下载-->
          <protocArtifact>
            com.google.protobuf:protoc:3.11.1:exe:${os.detected.classifier}
          </protocArtifact>
          <pluginId>grpc-java</pluginId>
        </configuration>
        <executions>
          <execution>
            <goals>
              <goal>compile</goal>
              <goal>compile-custom</goal>
            </goals>
          </execution>
        </executions>
      </plugin>
    </plugins>
  </build>

执行标红箭头的命令即可生成。

将生成的文件放入相应的包下面即可

demo测试

代码语言:javascript
复制
    @Test
    public void test3() throws InvalidProtocolBufferException {
        // 创建person对象
        Person person = Person.newBuilder()
            .setId(1)
            .setName("陈海洋")
            .setAge(18)
            .setEmail("1559843332@qq.com")
            .build();

        System.out.println(person);

        // 反序列化获取person
        byte[] bytes = person.toByteArray();
        Person newPerson = Person.parseFrom(bytes);
        System.out.println(newPerson);
    }

使用protobuf是为了节省用户流量,来实战下。

java作为服务端+客户端测试

代码语言:javascript
复制
// 暴露接口,返回二进制数据
@GetMapping("/person/{id}")
public byte[] person(@PathVariable("id") Integer id) {

    Person person = Person.newBuilder()
        .setId(id)
        .setName("陈海洋")
        .setAge(18)
        .setEmail("1559843332@qq.com")
        .build();

    return person.toByteArray();
}
    
// RestTemplate客户端测试
@Test
public void test1() throws IOException {

    RestTemplate restTemplate = new RestTemplate();
    String url = "http://localhost:8881/demo/person/2";
    ResponseEntity<Resource> forEntity = restTemplate.getForEntity(url, Resource.class);
    Person person = Person.parseFrom(forEntity.getBody().getInputStream());
    System.out.println(person);
    
}

客户端前端调用示例

既然是跨平台,js肯定也是可以解析二进制流的。 前端也可以通过proto文件生成相应的js。如下是js反序列化示例 为了写前端demo,也是爬了好多坑,都是泪啊!(本想基于原生的)

代码语言:javascript
复制
import messages from '../../utils/proto/person.js'

axios({
  method: 'get',
  url: 'http://localhost:8881/demo/person/10',
  responseType: 'arraybuffer'
}).then((res) => {
    console.log('res.data', res.data)
    var person = messages.Person.decode(new Uint8Array(res.data))
    console.log('java', person)
    console.log('java id', person.id)
  }
)

这只是demo,实际项目一般不会反悔bety[]数据。在我们的业务中是通过websocket来传输的。

项目地址

https://github.com/chywx/spring-boot-chy/tree/master/chy-protobuf

参考

用Maven实现一个protobuf的Java例子

protobufjs语法

axios 基本用法

JS中ArrayBuffer和Uint8Array区别

HTML5 Blob与ArrayBuffer、TypeArray和字符串String之间转换

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2021-03-16 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 整理下java和JavaScript的例子
  • demo测试
  • java作为服务端+客户端测试
  • 客户端前端调用示例
  • 项目地址
  • 参考
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档