gRPC生成TS文件遇TS2339警告，无法使用生成的getter/setter

问题核心原因 #

你通过gRPC-Gateway将gRPC接口转为HTTP REST接口后，客户端拿到的是JSON格式的普通对象，而非生成的jspb.Message子类实例（如TodoAllResponse）。生成的TypeScript类定义是针对protobuf二进制序列化的实例设计的，包含getTodoList()这类方法，但普通JSON对象没有这些方法；同时TS类型检查会因为类定义中未直接暴露字段属性（如title、todo）而抛出警告。

解决方案 #

方案1：将JSON响应转成protobuf实例 #

如果希望完全使用生成的gRPC模型类及其方法，需要把HTTP返回的JSON对象转换成对应的protobuf实例：

1. 导入生成的模型类和google-protobuf工具：

import { TodoAllResponse, Todo } from './path/to/generated/api_pb';
import * as jspb from 'google-protobuf';

2. 修改接口调用代码，将JSON转成实例：

async getAllTodos() {
    try {
        const res = await grpcClient.get(`/v1/getAll?${qs.stringify({})}`);
        // 将JSON对象转换为TodoAllResponse实例
        const todoResponse = TodoAllResponse.fromObject(res.data as TodoAllResponse.AsObject);
        // 现在可以正常调用getter方法
        console.log(todoResponse.getTodoList());
        return todoResponse;
    } catch (err) {
        console.log("error" + err);
    }
},

方案2：直接使用生成的AsObject类型适配JSON结构 #

如果不需要protobuf实例的方法，只想消除TS警告并直接访问JSON字段，可以使用生成类中自带的AsObject类型，该类型完全对应JSON响应的结构：

async getAllTodos() {
    try {
        return await grpcClient.get<TodoAllResponse.AsObject>(`/v1/getAll?${qs.stringify({})}`).then(res => {
            // res.data类型为TodoAllResponse.AsObject，直接访问todo字段无TS警告
            return res.data.todo;
        })
    } catch (err) {
        console.log("error" + err);
    }
},

在组件中也可以直接使用对应的AsObject类型：

import { Todo } from './path/to/generated/api_pb';

const todoArr = ref<Todo.AsObject[]>()

补充说明 #

关于你怀疑的repeated Todo todo = 1;定义：

• proto中repeated字段生成的protobuf实例方法是getTodoList()/setTodoList()，对应的JSON字段名就是todo（和proto中字段名一致）
• 生成的TodoAllResponse.AsObject类型中已经包含todo: Todo.AsObject[]的定义，完全匹配JSON响应结构

内容的提问来源于stack exchange，提问作者Mike3355