gRPC proto 生成JavaScript/TypeScript代码

创建项目

mkdir test-grpc
cd test-grpc

在test-grpc目录下创建以下文件,结构如下

    ├── src/                            # 源代码
    │   ├── proto/                      # Proto 文件
    │   │   ├── greeter/                # Greeter gRPC service
    │   │   │   └── greeter.proto        
    ├── scripts/                        # 脚本工具
    │   └── protoc.sh                   # 根据proto文件生成 js/ts代码脚本
    └── ...

初始化项目、安装相关包

npm init -y
npm install grpc google-protobuf dotenv
npm install typescript @types/node @types/google-protobuf @types/dotenv --save-dev

• grpc 用于gRPC与Node.js结合使用
• google-protobuf 用于javascript一起使用protobuf（.proto）
• dotenv从.env加载环境变量

编辑tsconfig

npx tsc --init

将以下内容添加到tsconfig.json文件中

{
  "compilerOptions": {
    "outDir": "./dist/",
    "module": "commonjs",
    "noImplicitAny": true,
    "allowJs": true,
    "esModuleInterop": true,
    "target": "es6",
    "sourceMap": true
  },
  "include": ["./src/**/*"],
  "exclude": ["node_modules"]
}

安装代码生成工具

npm install grpc-tools grpc_tools_node_protoc_ts --save-dev

• grpc-tools 为原始文件.proto生成javascript文件
• grpc_tools_node_protoc_ts 根据grpc-tools生成的js代码生成相应的d.ts代码

创建脚本并执行

scripts/protoc.sh

#!/usr/bin/env bash

BASEDIR=$(dirname "$0")
cd "${BASEDIR}"/../

PROTOC_GEN_TS_PATH="./node_modules/.bin/protoc-gen-ts"
GRPC_TOOLS_NODE_PROTOC_PLUGIN="./node_modules/.bin/grpc_tools_node_protoc_plugin"
GRPC_TOOLS_NODE_PROTOC="./node_modules/.bin/grpc_tools_node_protoc"

for f in ./src/proto/*; do

  # skip the non proto files
  if [ "$(basename "$f")" == "index.ts" ]; then
      continue
  fi

  # loop over all the available proto files and compile them into respective dir
  # JavaScript code generating
  ${GRPC_TOOLS_NODE_PROTOC} \
      --js_out=import_style=commonjs,binary:"${f}" \
      --grpc_out="${f}" \
      --plugin=protoc-gen-grpc="${GRPC_TOOLS_NODE_PROTOC_PLUGIN}" \
      -I "${f}" \
      "${f}"/*.proto

  ${GRPC_TOOLS_NODE_PROTOC} \
      --plugin=protoc-gen-ts="${PROTOC_GEN_TS_PATH}" \
      --ts_out="${f}" \
      -I "${f}" \
      "${f}"/*.proto

done

授权

sudo chmod +x ./scripts/protoc.sh

执行脚本

./scripts/protoc.sh

会生成四个文件:一个pb、一个grpc_pb(并生成了相应的ts代码)

src/proto/greeter
├── greeter.proto
├── greeter_grpc_pb.d.ts
├── greeter_grpc_pb.js
├── greeter_pb.d.ts
└── greeter_pb.js