[SOLVED] tRPC endpoint with a query parameter

tRPC endpoint with a query parameter

I am learning tRPC and I wanted to test its endpoint in postman. I have this procedure defined:

worldGreeting: publicProcedure.query(async () => {
    return {
        message: "Hello World!",
    }
}),
withName: publicProcedure.input(z.string()).query(async ({ ctx, input }) => {
    return {
        message: "Hello, " + input,
    }
}),

For the first procedure, I can easily test this in postman by calling the endpoint: http://localhost:4200/api/trpc/greetings.worldGreeting. However, I am not sure how to call the endpoint for the procedure withName.

I only have this but I am stuck on how to pass the data: http://localhost:4200/api/trpc/greetings.withName?name=Seven

I think I am missing the whole point of tRPC or something. How do I pass data in the endpoint?

Solution

Apparently, trpc encodes the url.

So, to call its endpoint via postman, you have to use the format: http://localhost:4200/api/trpc/greetings.withName?batch=1&input={"0":{"json": "Seven"}}.

It is important to note that if your procedure accepts an input z.object({id: z.string()}), then the value of your json key in the url should also be {"id": "..."} for it to work.