We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
grpc-web 封装了常用的API ,允许我们从浏览器访问 grpc 服务。envoy 允许我们将浏览器的请求转发到grpc 服务上。截止目前位置,envoy 配置是必须的。 至于为什么要使用 envoy,可以参考这个issue
示例项目:https://github.com/huangshuwei/vue-grpc-demo
下载并安装 docker
在windows 环境你需要使用docker 安装 envoy
安装好docker 你可以使用 docker 安装 envoy 了
docker pull envoyproxy/envoy:v1.17.0 docker run --rm envoyproxy/envoy:v1.17.0 --version
此处从官方示例拿过来,稍作修改。
官方示例如果使用grpc 服务端流模式会 15秒自动断开链接
我们将览器的 gRPC-Web 请求转发到后端。把这个放到 envoy.yaml 文件夹里。在这里,我们配置了envoy 去监听8080端口,并将请求转发到端口 8090上。
admin: access_log_path: /tmp/admin_access.log address: socket_address: { address: 0.0.0.0, port_value: 9902 } static_resources: listeners: - name: listener_0 address: socket_address: { address: 0.0.0.0, port_value: 8080 } filter_chains: - filters: - name: envoy.filters.network.http_connection_manager typed_config: "@type": type.googleapis.com/envoy.extensions.filters.network.http_connection_manager.v3.HttpConnectionManager codec_type: auto stat_prefix: ingress_http route_config: name: local_route virtual_hosts: - name: local_service domains: ["*"] routes: - match: { prefix: "/" } route: cluster: greeter_service max_grpc_timeout: 0s # 此处纠正了官方15秒断开链接的bug cors: allow_origin_string_match: - prefix: "*" allow_methods: GET, PUT, DELETE, POST, OPTIONS allow_headers: keep-alive,user-agent,cache-control,content-type,content-transfer-encoding,custom-header-1,x-accept-content-transfer-encoding,x-accept-response-streaming,x-user-agent,x-grpc-web,grpc-timeout max_age: "1728000" expose_headers: custom-header-1,grpc-status,grpc-message http_filters: - name: envoy.filters.http.grpc_web - name: envoy.filters.http.cors - name: envoy.filters.http.router clusters: - name: greeter_service connect_timeout: 0.25s type: logical_dns http2_protocol_options: {} lb_policy: round_robin # win/mac hosts: Use address: host.docker.internal instead of address: localhost in the line below load_assignment: cluster_name: cluster_0 endpoints: - lb_endpoints: - endpoint: address: socket_address: address: 0.0.0.0 # 此处换成你需要代理的 grpc 服务地址 port_value: 8090
前提是已经写好了客户端和服务端的代码,就可以根据这里参考上一篇文章
启动nodejs grpc 服务 nodejs 服务端口记得和 envoy 代理配置保持一致,上面 nodejs 服务端口为 8090
$ node server.js
启动 envoy 代理服务 我们使用docker 启动。官方模板命令:
$ docker run -d -v "$(pwd)"/envoy.yaml:/etc/envoy/envoy.yaml:ro \ -p 8080:8080 -p 9901:9901 envoyproxy/envoy:v1.17.0
"$(pwd)" 需要替换成你的真是地址,如我的示例命令:
$ docker run --name node-server-app -d -v G:\practice\grpc-tourist\vue-grpc-demo\envoy-node.yaml:/etc/envoy/envoy.yaml:ro -p 8090:8090 -p 9902:9902 envoyproxy/envoy:v1.17.0
如果启动报错,记得检查是否和本地端口重复
启动你的前端项目 此处具体操作依赖你的前端项目方式,推荐使用 vue-cli 搭建,简单省事。
The text was updated successfully, but these errors were encountered:
No branches or pull requests
前言
grpc-web 封装了常用的API ,允许我们从浏览器访问 grpc 服务。envoy 允许我们将浏览器的请求转发到grpc 服务上。截止目前位置,envoy 配置是必须的。
至于为什么要使用 envoy,可以参考这个issue
示例项目:https://github.com/huangshuwei/vue-grpc-demo
安装docker 容器
下载并安装 docker
安装 envoy
安装好docker 你可以使用 docker 安装 envoy 了
envoy 配置
此处从官方示例拿过来,稍作修改。
我们将览器的 gRPC-Web 请求转发到后端。把这个放到 envoy.yaml 文件夹里。在这里,我们配置了envoy 去监听8080端口,并将请求转发到端口 8090上。
生成Protobuf消息和客户端服务存根
前提是已经写好了客户端和服务端的代码,就可以根据这里参考上一篇文章
运行示例
启动nodejs grpc 服务
nodejs 服务端口记得和 envoy 代理配置保持一致,上面 nodejs 服务端口为 8090
启动 envoy 代理服务
我们使用docker 启动。官方模板命令:
"$(pwd)" 需要替换成你的真是地址,如我的示例命令:
如果启动报错,记得检查是否和本地端口重复
启动你的前端项目
此处具体操作依赖你的前端项目方式,推荐使用 vue-cli 搭建,简单省事。
链接
The text was updated successfully, but these errors were encountered: