diff --git a/src/client/index.ts b/src/client/index.ts index 0d4cabb..e613c6b 100644 --- a/src/client/index.ts +++ b/src/client/index.ts @@ -1,7 +1,7 @@ /** * This is the client-side code that uses the inferred types from the server */ -import { createTRPCClient, httpBatchLink } from '@trpc/client'; +import { createTRPCClient, unstable_httpBatchStreamLink } from '@trpc/client'; /** * We only import the `AppRouter` type from the server - this is not available at runtime */ @@ -10,7 +10,7 @@ import type { AppRouter } from '../server/index.js'; // Initialize the tRPC client const trpc = createTRPCClient({ links: [ - httpBatchLink({ + unstable_httpBatchStreamLink({ url: 'http://localhost:3000', }), ], @@ -34,3 +34,9 @@ console.log('Created user:', createdUser); const user = await trpc.user.byId.query('1'); // ^? console.log('User 1:', user); + +const iterable = await trpc.examples.iterable.query(); + +for await (const i of iterable) { + console.log('Iterable:', i); +} diff --git a/src/server/index.ts b/src/server/index.ts index a2f5a0a..2f97725 100644 --- a/src/server/index.ts +++ b/src/server/index.ts @@ -32,6 +32,14 @@ const appRouter = router({ return user; }), }, + examples: { + iterable: publicProcedure.query(async function* () { + for (let i = 0; i < 3; i++) { + await new Promise((resolve) => setTimeout(resolve, 500)); + yield i; + } + }), + }, }); // Export type router type signature, this is used by the client. diff --git a/src/server/trpc.ts b/src/server/trpc.ts index 2a9aec8..4fb28c8 100644 --- a/src/server/trpc.ts +++ b/src/server/trpc.ts @@ -4,7 +4,11 @@ import { initTRPC } from '@trpc/server'; * Initialization of tRPC backend * Should be done only once per backend! */ -const t = initTRPC.create(); +const t = initTRPC.create({ + experimental: { + iterablesAndDeferreds: true, + }, +}); /** * Export reusable router and procedure helpers