跳到主要內容
版本:11.x

伺服器端呼叫

您可能需要直接從主機它們的伺服器呼叫您的程序,createCallerFactory() 可用於達成此目的。這對於伺服器端呼叫和 tRPC 程序的整合測試很有用。

資訊

createCaller 不應使用於從其他程序呼叫程序。這會透過(可能)再次建立內容、執行所有中間件和驗證輸入來產生開銷 - 這些都已由目前的程序完成。相反地,您應將共用邏輯萃取到一個獨立函式,並從程序內部呼叫它,如下所示

建立呼叫者

使用 t.createCallerFactory 函式,您可以建立任何路由器的伺服器端呼叫者。您首先使用您要呼叫的路由器參數呼叫 createCallerFactory,然後它會傳回一個函式,您可以在其中傳入 Context 以進行後續程序呼叫。

基本範例

我們使用查詢建立路由器以列出文章並使用突變新增文章,然後我們呼叫每個方法。

ts
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
 
type Context = {
foo: string;
};
 
const t = initTRPC.context<Context>().create();
 
const publicProcedure = t.procedure;
const { createCallerFactory, router } = t;
 
interface Post {
id: string;
title: string;
}
const posts: Post[] = [
{
id: '1',
title: 'Hello world',
},
];
const appRouter = router({
post: router({
add: publicProcedure
.input(
z.object({
title: z.string().min(2),
}),
)
.mutation((opts) => {
const post: Post = {
...opts.input,
id: `${Math.random()}`,
};
posts.push(post);
return post;
}),
list: publicProcedure.query(() => posts),
}),
});
 
// 1. create a caller-function for your router
const createCaller = createCallerFactory(appRouter);
 
// 2. create a caller using your `Context`
const caller = createCaller({
foo: 'bar',
});
 
// 3. use the caller to add and list posts
const addedPost = await caller.post.add({
title: 'How to make server-side call in tRPC',
});
 
const postList = await caller.post.list();
const postList: Post[]
ts
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
 
type Context = {
foo: string;
};
 
const t = initTRPC.context<Context>().create();
 
const publicProcedure = t.procedure;
const { createCallerFactory, router } = t;
 
interface Post {
id: string;
title: string;
}
const posts: Post[] = [
{
id: '1',
title: 'Hello world',
},
];
const appRouter = router({
post: router({
add: publicProcedure
.input(
z.object({
title: z.string().min(2),
}),
)
.mutation((opts) => {
const post: Post = {
...opts.input,
id: `${Math.random()}`,
};
posts.push(post);
return post;
}),
list: publicProcedure.query(() => posts),
}),
});
 
// 1. create a caller-function for your router
const createCaller = createCallerFactory(appRouter);
 
// 2. create a caller using your `Context`
const caller = createCaller({
foo: 'bar',
});
 
// 3. use the caller to add and list posts
const addedPost = await caller.post.add({
title: 'How to make server-side call in tRPC',
});
 
const postList = await caller.post.list();
const postList: Post[]

整合測試中的範例用法

取自 https://github.com/trpc/examples-next-prisma-starter/blob/main/src/server/routers/post.test.ts

ts
import { inferProcedureInput } from '@trpc/server';
import { createContextInner } from '../context';
import { AppRouter, createCaller } from './_app';
test('add and get post', async () => {
const ctx = await createContextInner({});
const caller = createCaller(ctx);
const input: inferProcedureInput<AppRouter['post']['add']> = {
text: 'hello test',
title: 'hello test',
};
const post = await caller.post.add(input);
const byId = await caller.post.byId({ id: post.id });
expect(byId).toMatchObject(input);
});
ts
import { inferProcedureInput } from '@trpc/server';
import { createContextInner } from '../context';
import { AppRouter, createCaller } from './_app';
test('add and get post', async () => {
const ctx = await createContextInner({});
const caller = createCaller(ctx);
const input: inferProcedureInput<AppRouter['post']['add']> = {
text: 'hello test',
title: 'hello test',
};
const post = await caller.post.add(input);
const byId = await caller.post.byId({ id: post.id });
expect(byId).toMatchObject(input);
});

router.createCaller()

注意

router.createCaller() 已被棄用,並將在 tRPC 的 v11 或 v12 中移除。

使用 router.createCaller({}) 函式(第一個參數是 Context),我們會擷取 RouterCaller 的執行個體。

輸入查詢範例

我們使用輸入查詢建立路由器,然後我們呼叫非同步 greeting 程序以取得結果。

ts
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
 
const t = initTRPC.create();
 
const router = t.router({
// Create procedure at path 'greeting'
greeting: t.procedure
.input(z.object({ name: z.string() }))
.query((opts) => `Hello ${opts.input.name}`),
});
 
const caller = router.createCaller({});
const result = await caller.greeting({ name: 'tRPC' });
const result: string
ts
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
 
const t = initTRPC.create();
 
const router = t.router({
// Create procedure at path 'greeting'
greeting: t.procedure
.input(z.object({ name: z.string() }))
.query((opts) => `Hello ${opts.input.name}`),
});
 
const caller = router.createCaller({});
const result = await caller.greeting({ name: 'tRPC' });
const result: string

突變範例

我們使用突變建立路由器,然後我們呼叫非同步 post 程序以取得結果。

ts
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
 
const posts = ['One', 'Two', 'Three'];
 
const t = initTRPC.create();
const router = t.router({
post: t.router({
add: t.procedure.input(z.string()).mutation((opts) => {
posts.push(opts.input);
return posts;
}),
}),
});
 
const caller = router.createCaller({});
const result = await caller.post.add('Four');
const result: string[]
ts
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
 
const posts = ['One', 'Two', 'Three'];
 
const t = initTRPC.create();
const router = t.router({
post: t.router({
add: t.procedure.input(z.string()).mutation((opts) => {
posts.push(opts.input);
return posts;
}),
}),
});
 
const caller = router.createCaller({});
const result = await caller.post.add('Four');
const result: string[]

具有中間件的 Context 範例

我們建立一個中間件,在執行 secret 程序之前檢查 context。以下有兩個範例:前者失敗,因為 context 不符合中間件邏輯,而後者則正常運作。


資訊

中間件會在呼叫任何程序之前執行。


ts
import { initTRPC, TRPCError } from '@trpc/server';
 
type Context = {
user?: {
id: string;
};
};
const t = initTRPC.context<Context>().create();
 
const protectedProcedure = t.procedure.use((opts) => {
const { ctx } = opts;
if (!ctx.user) {
throw new TRPCError({
code: 'UNAUTHORIZED',
message: 'You are not authorized',
});
}
 
return opts.next({
ctx: {
// Infers that the `user` is non-nullable
user: ctx.user,
},
});
});
 
const router = t.router({
secret: protectedProcedure.query((opts) => opts.ctx.user),
});
 
{
// ❌ this will return an error because there isn't the right context param
const caller = router.createCaller({});
 
const result = await caller.secret();
}
 
{
// ✅ this will work because user property is present inside context param
const authorizedCaller = router.createCaller({
user: {
id: 'KATT',
},
});
const result = await authorizedCaller.secret();
const result: { id: string; }
}
ts
import { initTRPC, TRPCError } from '@trpc/server';
 
type Context = {
user?: {
id: string;
};
};
const t = initTRPC.context<Context>().create();
 
const protectedProcedure = t.procedure.use((opts) => {
const { ctx } = opts;
if (!ctx.user) {
throw new TRPCError({
code: 'UNAUTHORIZED',
message: 'You are not authorized',
});
}
 
return opts.next({
ctx: {
// Infers that the `user` is non-nullable
user: ctx.user,
},
});
});
 
const router = t.router({
secret: protectedProcedure.query((opts) => opts.ctx.user),
});
 
{
// ❌ this will return an error because there isn't the right context param
const caller = router.createCaller({});
 
const result = await caller.secret();
}
 
{
// ✅ this will work because user property is present inside context param
const authorizedCaller = router.createCaller({
user: {
id: 'KATT',
},
});
const result = await authorizedCaller.secret();
const result: { id: string; }
}

Next.js API 端點範例

提示

此範例顯示如何在 Next.js API 端點中使用呼叫者。tRPC 已為您建立 API 端點,因此此檔案僅用於顯示如何從另一個自訂端點呼叫程序。

ts
import { TRPCError } from '@trpc/server';
import { getHTTPStatusCodeFromError } from '@trpc/server/http';
import { appRouter } from '~/server/routers/_app';
import type { NextApiRequest, NextApiResponse } from 'next';
 
type ResponseData = {
data?: {
postTitle: string;
};
error?: {
message: string;
};
};
 
export default async (
req: NextApiRequest,
res: NextApiResponse<ResponseData>,
) => {
/** We want to simulate an error, so we pick a post ID that does not exist in the database. */
const postId = `this-id-does-not-exist-${Math.random()}`;
 
const caller = appRouter.createCaller({});
 
try {
// the server-side call
const postResult = await caller.post.byId({ id: postId });
 
res.status(200).json({ data: { postTitle: postResult.title } });
} catch (cause) {
// If this a tRPC error, we can extract additional information.
if (cause instanceof TRPCError) {
// We can get the specific HTTP status code coming from tRPC (e.g. 404 for `NOT_FOUND`).
const httpStatusCode = getHTTPStatusCodeFromError(cause);
 
res.status(httpStatusCode).json({ error: { message: cause.message } });
return;
}
 
// This is not a tRPC error, so we don't have specific information.
res.status(500).json({
error: { message: `Error while accessing post with ID ${postId}` },
});
}
};
ts
import { TRPCError } from '@trpc/server';
import { getHTTPStatusCodeFromError } from '@trpc/server/http';
import { appRouter } from '~/server/routers/_app';
import type { NextApiRequest, NextApiResponse } from 'next';
 
type ResponseData = {
data?: {
postTitle: string;
};
error?: {
message: string;
};
};
 
export default async (
req: NextApiRequest,
res: NextApiResponse<ResponseData>,
) => {
/** We want to simulate an error, so we pick a post ID that does not exist in the database. */
const postId = `this-id-does-not-exist-${Math.random()}`;
 
const caller = appRouter.createCaller({});
 
try {
// the server-side call
const postResult = await caller.post.byId({ id: postId });
 
res.status(200).json({ data: { postTitle: postResult.title } });
} catch (cause) {
// If this a tRPC error, we can extract additional information.
if (cause instanceof TRPCError) {
// We can get the specific HTTP status code coming from tRPC (e.g. 404 for `NOT_FOUND`).
const httpStatusCode = getHTTPStatusCodeFromError(cause);
 
res.status(httpStatusCode).json({ error: { message: cause.message } });
return;
}
 
// This is not a tRPC error, so we don't have specific information.
res.status(500).json({
error: { message: `Error while accessing post with ID ${postId}` },
});
}
};

錯誤處理

createFactoryCallercreateCaller 函式可透過 onError 選項取得錯誤處理常式。這可用於擲出未包裝在 TRPCError 中的錯誤,或以其他方式回應錯誤。傳遞至 createCallerFactory 的任何處理常式會在傳遞至 createCaller 的處理常式之前呼叫。處理常式會使用與錯誤格式化器相同的引數呼叫,但預期為 shape 欄位

ts
{
ctx: unknown; // The request context
error: TRPCError; // The TRPCError that was thrown
path: string | undefined; // The path of the procedure that threw the error
input: unknown; // The input that was passed to the procedure
type: 'query' | 'mutation' | 'subscription' | 'unknown'; // The type of the procedure that threw the error
}
ts
{
ctx: unknown; // The request context
error: TRPCError; // The TRPCError that was thrown
path: string | undefined; // The path of the procedure that threw the error
input: unknown; // The input that was passed to the procedure
type: 'query' | 'mutation' | 'subscription' | 'unknown'; // The type of the procedure that threw the error
}
ts
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
 
const t = initTRPC
.context<{
foo?: 'bar';
}>()
.create();
 
const router = t.router({
greeting: t.procedure.input(z.object({ name: z.string() })).query((opts) => {
if (opts.input.name === 'invalid') {
throw new Error('Invalid name');
}
 
return `Hello ${opts.input.name}`;
}),
});
 
const caller = router.createCaller(
{
/* context */
},
{
onError: (opts) => {
console.error('An error occurred:', opts.error);
},
},
);
 
// The following will log "An error occurred: Error: Invalid name", and then throw a plain error
// with the message "This is a custom error"
await caller.greeting({ name: 'invalid' });
ts
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
 
const t = initTRPC
.context<{
foo?: 'bar';
}>()
.create();
 
const router = t.router({
greeting: t.procedure.input(z.object({ name: z.string() })).query((opts) => {
if (opts.input.name === 'invalid') {
throw new Error('Invalid name');
}
 
return `Hello ${opts.input.name}`;
}),
});
 
const caller = router.createCaller(
{
/* context */
},
{
onError: (opts) => {
console.error('An error occurred:', opts.error);
},
},
);
 
// The following will log "An error occurred: Error: Invalid name", and then throw a plain error
// with the message "This is a custom error"
await caller.greeting({ name: 'invalid' });