如何在Postman中调用带参数的tRPC Query端点？

核心原因 #

tRPC的Query请求参数需要包裹在input字段中，而非直接作为URL的普通查询参数，这是你之前传参失败的关键。

两种可行的传参方法 #

方法1：使用GET请求（URL参数方式）

tRPC要求Query的参数必须通过input这个查询键传递，且值为参数的JSON格式（需URL编码）。

• 如果你的withName接收单个字符串（比如procedure定义为input: z.string()）：
  在Postman中操作：

  • 请求方法选GET
  • 输入基础URL：http://localhost:4200/api/trpc/greetings.withName
  • 切换到「Params」标签，添加键input，值填"Seven"（带双引号），Postman会自动完成URL编码，最终请求URL会变为http://localhost:4200/api/trpc/greetings.withName?input=%22Seven%22

• 如果你的withName接收对象参数（比如procedure定义为input: z.object({ name: z.string() })）：
  在Postman中操作：

  • 请求方法选GET
  • 输入基础URL：http://localhost:4200/api/trpc/greetings.withName
  • 切换到「Params」标签，添加键input，值填{"name": "Seven"}，Postman自动编码后URL会变为http://localhost:4200/api/trpc/greetings.withName?input=%7B%22name%22%3A%22Seven%22%7D

方法2：使用POST请求（JSON体传参）

tRPC允许用POST请求处理Query，这种方式无需处理URL编码，更直观：

• 请求方法选POST
• 输入URL：http://localhost:4200/api/trpc/greetings.withName
• 切换到「Body」标签，选择「raw」，格式选JSON
• 根据procedure定义填写请求体：
  • 若接收单个字符串：{"input": "Seven"}
  • 若接收对象参数：{"input": {"name": "Seven"}}
• 确保请求头的Content-Type设置为application/json

验证你的Procedure定义 #

确认withName的input定义和传参匹配：

// 单个字符串输入的示例
const withName = publicProcedure
  .input(z.string())
  .query(({ input }) => {
    return { message: `Hello ${input}!` };
  });

// 对象输入的示例
const withName = publicProcedure
  .input(z.object({ name: z.string() }))
  .query(({ input }) => {
    return { message: `Hello ${input.name}!` };
  });

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