trpc-webrtc
TypeScript icon, indicating that this package has built-in type declarations

0.1.4 • Public • Published

trpc-webrtc

A set of tRPC adapters to enable type-safe communication via RTCDataChannel in the browser.

  • Compatible with tRPC >=10.20.0.
  • Use any RTCDataChannel as an in-browser tRPC server.
  • Full support for queries, mutations, and subscriptions.

Installation

# Using pnpm
pnpm add trpc-webrtc

# Using yarn
yarn add trpc-webrtc

# Using npm
npm install --save trpc-webrtc

Getting Started

  1. Initialize tRPC, with allowOutsideOfServer: true:
import { initTRPC } from "@trpc/server";
const t = initTRPC.create({ allowOutsideOfServer: true });
  1. Create a router, as usual:
const appRouter = t.router({
  testQuery: t.procedure.query(() => ({ hello: "world" })),
});
type AppRouter = typeof appRouter;
  1. Invoke applyDataChannelHandler on an RTCDataChannel (rx) to act as the server:
import { applyDataChannelHandler } from "trpc-webrtc";
const handler = applyDataChannelHandler({
  dataChannel: rx,
  router: appRouter,
});
  1. Create a client, using dataChannelLink with an RTCDataChannel (tx):
import { createTRPCProxyClient } from "@trpc/client";
import { createDataChannelClient, dataChannelLink } from "trpc-webrtc";

const client = createTRPCProxyClient<AppRouter>({
  links: [
    dataChannelLink({
      client: createDataChannelClient({ dataChannel: tx }),
    }),
  ],
});

Package Sidebar

Install

npm i trpc-webrtc

Weekly Downloads

0

Version

0.1.4

License

MIT

Unpacked Size

30.2 kB

Total Files

13

Last publish

Collaborators

  • bengreenier