setting up a grpc typescript client

Question

I am trying to setup a GRPC client to communicate with my goLang backend. The server is setup but I am having a lot of issues setting up the Client. I found a decent example here

But I am still not able to declar my client server.

This was my attempt to setup the server but it cannot find any of the endpoints which make me believe it is wrong.

// @ts-ignore
import * as grpc from "@grpc/grpc-js";
import {TestRequest} from "./src/proto/api_pb";
import services from "./src/proto/api_grpc_pb";

const client = new grpc.Client(
    "localhost:8082",
    grpc.credentials.createInsecure()
)

const request = new TestRequest();
request.setName("Hello World");

--

I want to declare the client from the imported services but in the IDE I see and error reading api_grpc_pb has no default export.

In the example link I sent it has something like

const client = new services.GreeterClient(
  "localhost:50051",
  grpc.credentials.createInsecure()
);

Of course my name is different, and in the generated file I have api_grpc_pb.js.

exports.ApiServiceClient = grpc.makeGenericClientConstructor(ApiServiceService);

However that is not accessible.

Makefile

.PHONY: proto
proto: ## Generate protobuf code
# Compile proto files inside the project.
    protoc api.proto --proto_path=${PROJ_PATH}/proto --go_out=. --go-grpc_out=.

    protoc --proto_path=${PROJ_PATH}/proto \
        --plugin=protoc-gen-grpc=${PROJ_PATH}/form/node_modules/.bin/grpc_tools_node_protoc_plugin \
        --plugin=protoc-gen-ts=${PROJ_PATH}/form//node_modules/.bin/protoc-gen-ts \
        --js_out=import_style=commonjs:${PROJ_PATH}/form/proto \
        --grpc_out=grpc_js:${PROJ_PATH}/form/proto \
        --ts_out=grpc_js:${PROJ_PATH}/form/proto \
        -I ${PROJ_PATH}/proto \
         ${PROJ_PATH}/proto/*.proto

package.json

"google-protobuf": "^3.21.0",
"grpc-tools": "^1.11.3",
"grpc-web": "^1.0.7",
"protoc-gen-grpc": "^2.0.3",
"protoc-gen-ts": "^0.8.5",
"ts-protoc-gen": "^0.15.0",
"grpc_tools_node_protoc_ts": "^5.3.2",

Here is the repo I am currently working in grpc_attempt_2

Any advice on how I can setup/run my GRPC typescript client would be greatly appreciated.

Here is a picture of where I think the client is suppose to be exported.

--- it has been brought to my attention my import might be wrong

It should look like this...

import {ApiServiceClient} from "./src/proto/api_grpc_pb";

However the methods are still not available. Here is a picture of what I am facing.

Answer 1

In the example you linked, they import the service client class using this line:

import { GreeterService } from "./my_generated_code/helloworld_grpc_pb";

In this case, GreeterService is the name of the service client class. In the generated code in this question, the service client class is named ApiServiceClient. So, you should use a similar import line:

import { ApiServiceClient } from "./src/proto/api_grpc_pb";

This should replace this import line in your client code file:

import services from "./src/proto/api_grpc_pb";`

---

In addition, you should not construct a grpc.Client object directly. That will not have the generated code for the service, so you will not be able to make any requests to any methods. You should instead construct the generated service client class:

const client = new ApiServiceClient(
    "localhost:8082",
    grpc.credentials.createInsecure()
);