第一个gRPC-web项目
Posted weixin_45747080
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了第一个gRPC-web项目相关的知识,希望对你有一定的参考价值。
第一个gRPC-web项目
1、什么是gRPC-web?
简单来说,gRPC-web就是gRPC的javascript版本的client实现
2、gRPC-web工作流程
由于浏览器的特性,gRPC-web其实没办法直接向gRPC-server发送HTTP/2请求的,只有通过envoy代理,将来自gRPC-web的HTTP/1的请求转换为gRPC-server能够接收的HTTP/2请求
3、安装gRPC-web相关依赖
在使用下列命令前确保开发环境已经安装node
全局安装protoc-gen-grpc-web
插件
npm i protoc-gen-grpc-web -g #全局安装
在web项目中安装(确保项目使用npm init -y
初始化)
npm i protobufjs
npm i grpc-web
4、编写proto文件
编写proto文件,并且通过插件将proto文件编译为js文件
syntax = "proto3"; //语法版本
package pb;
option go_package = "./;pb"; //生成的go文件的包名
message HelloRequest
string name = 1;
message HelloResponse
string message = 1;
//一个 rpc 服务通过参数和返回类型来指定可以远程调用的方法
service Hello
// rpc 定义可远程调用服务
rpc HelloWorld (HelloRequest) returns (HelloResponse)
利用插件将proto文件编译为js文件
protoc --proto_path=proto proto/*proto \\
--js_out=import_style=commonjs:./pb \\
--grpc-web_out=import_style=commonjs,mode=grpcwebtext:./pb
语义:
--proto_path
指proto文件所在的目录
--js_out=import_style=commonjs:./pb
指利用commonjs将编译后的js文件存放在./pb
目录中
--grpc-web_out=import_style=commonjs,mode=grpcwebtext:./pb
指利用commonjs将编译后的grpc-web的js文件存放在./pb
目录,并且模式是grpcwebtext
同样的,也可以添加到Makefile中
gen:
protoc --proto_path=proto proto/*proto \\
--js_out=import_style=commonjs:./pb \\
--grpc-web_out=import_style=commonjs,mode=grpcwebtext:./pb
clean:
rm pb/*.js
5、启用客户端
// 从pb中拿到request和response
import HelloRequest,HelloResponse from './pb/hello_pb.js'
// 从grpc_web_pb中拿到client
import HelloClient from './pb/hello_grpc_web_pb.js'
// 获得client
const client = new HelloClient('http://localhost:9001');
// 构建request
let request = new HelloRequest();
request.setName('World!');
// 利用request发起请求,得到response响应
// 其中response包含在一个回调函数当中
client.helloWorld(request, , (err,response) =>
if (err) //获得response失败
console.log('response err ',err)
else // 获得response成功
console.log('receive from server: ',response)
)
可以发现,和gRPC-client的go的实现的步骤是差不多的,1、从生成的文件中获得client,然后利用client执行service中的方法,最后获得response。
5、已知缺点
只支持server往client发送消息流,其余方式的信息流不支持
6、envoy代理
envoy是一个代理服务,类似于nginx。
gRPC-web目前支持HTTP/1.0和HTTP/1.1,但是gRPC请求要求的协议是HTTP2,所以gRPC-web发送过来的请求无法直接被gRPC-server(服务端)接受,所以需要使用envoy做一次代理转换,将来自gRPC-web的请求HTTP/1请求转换为gRPC-server能使用的HTTP/2请求。
以上是关于第一个gRPC-web项目的主要内容,如果未能解决你的问题,请参考以下文章
微软发布gRPC-Web实现,可直接在浏览器端调用gRPC服务
一个新实验:使用gRPC-Web从浏览器调用.NET gRPC服务