前言

今天给大家介绍一位公众号的贵客：

姓名：Javen

Email：javendev@126.com

Github：https://github.com/Javen205

Gitee：https://gitee.com/Javen205

CSDN：https://blog.csdn.net/zywjava

特长：擅长聚合支付、QQ玩一玩

开源项目：IJPay、weixinguide作者

Javen今天带来的是google-protobuf在前后端的应用，为了降低大家的阅读负担，公众号只节选了其中基础部分以及在Cocos Creator的使用。大家可以通过阅读原文更多地了解到google-protobuf在Java、QQ玩一玩等平台上的使用。

1. 什么是protobuf

protobuf是一种灵活高效的独立于语言平台的结构化数据表示方法，与XML相比，protobuf更小更快更简单。你可以用定义自己protobuf的数据结构，用ProtoBuf编译器生成特定语言的源代码，如C++，Java，Python等，目前protobuf对主流的编程语言都提供了支持,非常方便的进行序列化和反序列化。

特点：

• 平台无关、语言无关。

• 二进制、数据自描述。

• 提供了完整详细的操作API。

• 高性能 比xml要快20-100倍

• 尺寸小 比xml要小3-10倍 高可扩展性

• 数据自描述、前后兼容

下载protobuf的编译器

目前最新版本为Protocol Buffers v3.6.1

2. 配置环境变量

解压 protoc-3.6.1-osx-x86_64.zip

Mac 配置环境变量 vi ~/.bash_profile 使其配置生效 source ~/.bash_profile

#protobuf
export PROTOBUF_HOME=/Users/Javen/Documents/dev/java/protobuf/protoc-3.6.1-osx-x86_64
export PATH=$PATH:$PROTOBUF_HOME/bin

Window 将bin添加到path 即可 例如: D:\protobuf\protoc-3.6.1-win32\bin

本文在Mac环境下编写  Mac与window命令唯一的区别就是需要将 protoc改成 protoc.exe 前提是需要添加环境变量。

3. 编写一个proto文件

文件保存为 chat.proto 此 proto文件摘自t-io 让天下没有难开发的网络编程

syntax = "proto3";
package com.im.common.packets;//设置java对应的packageoption java_package = "com.im.common.packets";
option java_multiple_files = true; /** * 聊天类型  */
enum ChatType { CHAT_TYPE_UNKNOW = 0;//未知  CHAT_TYPE_PUBLIC = 1;//公聊  CHAT_TYPE_PRIVATE = 2;//私聊
}
/** * 聊天请求  */
message ChatReqBody {   int64 time = 1;//消息发送时间    ChatType type = 2; //聊天类型  string text = 3; //聊天内容    string group = 4; //目标组id  int32 toId = 5; //目标用户id，   string toNick = 6; //目标用户nick
}   /** * 聊天响应  */
message ChatRespBody {  int64 time = 1;//消息发送时间    ChatType type = 2; //聊天类型  string text = 3; //聊天内容    int32 fromId = 4; //发送聊天消息的用户id    string fromNick = 5; //发送聊天消息的用户nick   int32 toId = 6; //目标用户id   string toNick = 7; //目标用户nick  string group = 8; //目标组id
}

4. 编译器proto为js

protoc --js_out=import_style=commonjs,binary:. chat.proto

执行后会在当前文件夹中生成 chat_pb.js 文件，这里面就是 protobuf的API和一些函数。如果是 Node.js 就可以直接使用了，如果想在浏览器(前端)中使用 protobuf还需要做一些处理。

在 chat_pb.js文件的同级目录下安装引用库

npm install -g require
npm install google-protobuf
npm install -g browserify

编写脚本保存为exports.js，使用browserify对文件进行编译打包

var chatProto = require('./chat_pb');
module.exports = {     DataProto: chatProto
}

执行命令

browserify exports.js > chat.js

对 chat_pb.js文件进行编译打包生成 chat.js后就可以在Cocos Creator愉快的使用了。

5. 使用示例

将生成的chat.js导入项目，Cocos Creator会提示是否设置为插件，在这里选择是。

cc.Class({   extends: cc.Component,  buttonClick() { var chatReqBody = new proto.com.im.common.packets.ChatReqBody();   chatReqBody.setTime(new Date().getTime());  chatReqBody.setText("测试");    chatReqBody.setType(1); chatReqBody.setGroup("Javen");    chatReqBody.setToid(666);   chatReqBody.setTonick("Javen205");    var bytes = chatReqBody.serializeBinary();     console.log("序列化为字节:"+bytes);    var data = proto.com.im.common.packets.ChatReqBody.deserializeBinary(bytes);   console.log("反序列化为对象:"+data);    console.log("从对象中获取指定属性:"+data.getTonick()); console.log("对象转化为JSON:"+JSON.stringify(data));  }
});

Cocos Creator的插件脚本会将导出的对象设置为全局变量，因此在使用时无需要require任何js文件，proto对象直接可以使用啦！

demo源码链接: https://pan.baidu.com/s/1hy12FdO1tNL7pV8kNPXpUw 密码:huil

6. 后记

google-protobuf是Cocos Creator中使用protobuf另一个解决方案。它与之前Shawn提供的protobufjs有所不同，使用google-protobuf是使用protoc命令将proto文件编译为js，做为Cocos Creator的插件。这下不喜欢将proto文件暴露在安装包里的同学有福了，看来pbkiller替代品了，要加油了哦！

如果觉得公众号上的文章对您或您身边的朋友有帮助，请分享给他们，愿我们一起成长！