假如有一个HelloWorld.proto文件,内容如下:

syntax = "proto3";option java_package = "ex.grpc";
option objc_class_prefix = "HSW";package helloworld;service Greeter {rpc sayHello (HelloRequest) returns (HelloReply) {}rpc printAge (printAgeRequest) returns (printAgeReply) {}
}message HelloRequest {string name = 1;string city = 2;
}message HelloReply {string message = 1;
}message printAgeRequest {string age = 1;
}message printAgeReply {string text = 1;
}

项目需要根据proto文件生成js文件和service文件

这里需要先下载protoc.exe执行程序,下载地址:https://github.com/protocolbuffers/protobuf/releases

选择protoc-3.12.4-win64.zip下载,安装完成后需要将bin目录添加到环境变量中,然后执行命令

> protoc --version
libprotoc 3.12.4

再在项目中通过npm安装ts-protoc-gen

[project]> cnpm i ts-protoc-gen -S

接着进入到存放proto文件的目录,执行以下命令

protos> protoc --plugin="protoc-gen-ts=/nodejs/experiment/vue-test/node_modules/ts-protoc-gen/bin/protoc-gen-ts.cmd" --ts_out="service=grpc-web:./" ./HelloWorld.proto

即可生成下面四个文件:

HelloWorld_pb.js
HelloWorld_pb_service.js
HelloWorld_pb.d.ts
HelloWorld_pb_service.d.ts

在vue中使用

import { GreeterClient } from "@/assets/protos/HelloWorld_pb_service.js";
import { HelloRequest } from "@/assets/protos/HelloWorld_pb.js";const helloRequest = new HelloRequest();const client = new GreeterClient('http://127.0.0.1:50051');
client.sayHello(helloRequest, {"Content-Type": "application/grpc-web+proto"}, (err, response) => {console.log(err, response)
});

需要安装

> npm i @improbable-eng/grpc-web google-protobuf -S
import { grpc } from "@improbable-eng/grpc-web";
import { Greeter } from "@/assets/protos/HelloWorld_pb_service.js";
import { HelloRequest } from "@/assets/protos/HelloWorld_pb.js";const helloRequest = new HelloRequest();grpc.unary(Greeter.sayHello, {request: helloRequest,host: "http://127.0.0.1:50051",onMessage: (message) => {console.log(message.toObject());},onEnd: (res) => {const { status, statusMessage, headers, message, trailers } = res;if (status === grpc.Code.OK && message) {console.log("all ok. got book: ", message.toObject());}},
});

欢迎关注:http://fenxianglu.cn/

根据proto文件生成pb和pb_service文件相关推荐

  1. pb文件生成java类,根据proto文件生成pb和pb_service文件

    假如有一个HelloWorld.proto文件,内容如下: syntax = "proto3"; option java_package = "ex.grpc" ...

  2. Cocos Creator TypeScript 中使用ProtoBuf(利用工具把proto文件生成对应的js文件以及ts文件)

    我是一枚刚入坑cocos的小白o(╯□╰)o 开发环境:Cocos Creator 1.9   (需要安装Node.js,使用npm命令) 在网上找了很久都是讲的protobuf.js的用法,但是没有 ...

  3. java生成pdf_Java实现PDF文件生成并且打印pdf文件 demo

    ## Java实现PDF生成并且打印pdf文件(附demo) #### 目录: 0. 效果预览 1. 准备环境 2. Java如何调用打印机进行打印 3. Java如何生成pdf打印文件 4. 实现p ...

  4. 多个cpp文件生成so_C++:C++的文件搜索路径

    在做大型工程的时候,除了有C++语法知识之外,还要有工程能力. 最先要具备的能力是: 理解C++文件的编译,链接过程. 明白C++头文件的搜索路径. 本文,介绍C++的文件搜索路径. 对于C++文件来 ...

  5. 依据BOM和已经存在的文件生成其他种类的文件

    在BOM中记录中有物料编码,物料名称,物料规格等,而且依据BOM已经生成了一些的文件,如采购规格书,这个时候需要生成相应的检验规格书模板,可以使用下面的VBA代码,具体代码如下: Function I ...

  6. 使用NPOI按照word模板文件生成新的word文件

    /// <summary>/// 按照word模板文件 生成新word文件/// </summary>/// <param name="tempFile&quo ...

  7. npoi word生成HTML,使用NPOI按照word模板文件生成新的word文件

    /// /// 按照word模板文件 生成新word文件 /// /// 模板文件路径 /// 生成文件路径 /// 议案登记 public void CreateFileByTemplate(str ...

  8. 【LaTex】利用ins文件和dtx文件生成cls或sty文件,latex宏包的生成与创建方法;配置宏包文件的方法,latex宏包文件放置目录

    一.宏包文件无法找到 在编译tex文件时,如果宏包文件并不在配置目录中,就会发出类似[LaTeX Error: File `pageno.sty' not found.]的错误. 二.解决方法就是自己 ...

  9. 使用key和pem文件生成 pfx 或 jks 文件

    1.准备好 key 和 pem 文件 server.key server.pem 2.生成 pfx 文件 openssl pkcs12 -export -out server.pfx -inkey s ...

最新文章

  1. 一键cosplay各路动漫人物!快手的这个BlendGAN火了 | NeurIPS 2021
  2. python按时间排序 文件
  3. 密码学笔记——zip明文攻击
  4. jQuery笔记总结
  5. 聊聊推荐系统的高阶特征交叉问题
  6. Asp.Net自学笔记...(运算符)
  7. C++ STL pair方法详解
  8. 【Clickhouse】Clickhouse Live View
  9. itextdef将动态html转为pdf,[C#]使用第三方开源库iText7.pdfHtml,将Html转换成Pdf,以及如何以Html作为打印模板...
  10. 中国产业数字化发展报告:数智创新,智驱未来
  11. jQuery的页面加载事件
  12. python使用 urllib.unquote乱码的原因
  13. 推荐25个值得收藏的前端开源Awesome项目
  14. Restricted RPS
  15. 团队管理经典书籍推荐:《团队管理必读12篇》
  16. 实变函数笔记——对数与基数
  17. MySql报错1153
  18. 图灵机器人:到基层去,做人工智能的开放平台
  19. 2.4G SOC芯片CI2451/CI2454应用于遥控玩具汽车的应用方案
  20. 千年虫与2038年问题

热门文章

  1. 6月程序员薪资统计出炉!前端薪资差距高达5倍!还躺平?
  2. 上海00后985毕业女生月薪1.2w,想找年薪40万程序员,网友表示很不理解
  3. 如何将一个excel表格的数据匹配到另一个表中
  4. python 矩阵拼接
  5. springcloud体育用品网上商城多商家springboot+vue
  6. 捞月狗app下载|捞月狗app安卓版
  7. QCustomPlot 多个坐标系
  8. 华为荣耀9的android版本号,华为荣耀9是什么系统_华为荣耀9系统更新-太平洋IT百科...
  9. android ip 定位,IP定位-API文档-开发指南-Web服务 API | 高德地图API
  10. FPGA——I2C代码篇