grpc-web 介绍

grpc/grpc-web gRPC for Web Clients，浏览器客户端 gRPC 的 JavaScript 实现

介绍

• 2018/10/24 CNCF 正式发布 GA 版本的 gRPC-Web，这是一个 JavaScript 客户端库，使 Web 应用程序能够直接与后端 gRPC 服务通信，不需要 HTTP 服务器充当中介
  • 解决：由于浏览器没有直接暴露HTTP/2，Web 应用程序不能直接使用 gRPC，gRPC-Web 可以实现这个功能
• gRPC Web 提供了一个 JS 客户端库，支持与 gRPC-Node 相同的 API，以访问 gRPC 服务
  • 由于浏览器的限制，网络客户端库实现的协议与原生 gRPC 协议不同
  • Content-Type
    • application/grpc-web+[proto, json, thrift]
    • application/grpc-web-text+[proto, thrift]
  • 是一个 JavaScript 客户端库，使 Web 应用程序能够直接与后端 gRPC 服务通信，不需要 HTTP 服务器充当中介

示例

参考

# (Prerequisite) 1. Protobuf (protoc)
brew install protobuf

# (Prerequisite) 2. Protobuf-javascript (protoc-gen-js)
wget https://github.com/protocolbuffers/protobuf-javascript/releases/download/v3.21.2/protobuf-javascript-3.21.2-osx-x86_64.tar.gz
tar -zxvf protobuf-javascript-3.21.2-osx-x86_64.tar.gz
mv bin/protoc-gen-js /usr/local/bin

# 3. Install gRPC-Web Code Generator
wget https://github.com/grpc/grpc-web/releases/download/1.5.0/protoc-gen-grpc-web-1.5.0-darwin-x86_64
chmod a+x protoc-gen-grpc-web-1.5.0-darwin-x86_64
mv protoc-gen-grpc-web-1.5.0-darwin-x86_64 /usr/local/bin/protoc-gen-grpc-web

# (Optional) 4. Verify Installations
git clone https://github.com/xiexianbin/go-grpc-demo.git
cd go-grpc-demo
mkdir dist

protoc -I=. proto/demo.proto \
  --js_out=import_style=commonjs:./dist \
  --grpc-web_out=import_style=commonjs,mode=grpcwebtext:./dist

$ ls dist/proto
demo_grpc_web_pb.js demo_pb.js

说明：

• demo_pb.js Generated by protoc-gen-js plugin
• demo_grpc_web_pb.js Generated by gRPC-Web plugin