React Native Adapter

React Native integration.

Fetch Link

React Native includes a Fetch API, so oRPC works out of the box.

Fetch in React Native is limited. oRPC features like File/Blob and Event Iterator aren't supported. Follow Support Stream #27741 for updates.

For binary data, extend the RPC JSON Serializer to encode as Base64.

import { RPCLink } from '@orpc/client/fetch'

const link = new RPCLink({
  url: 'http://localhost:3000/rpc',
  headers: async ({ context }) => ({
    'x-api-key': context?.something ?? ''
  })
})

expo/fetch

If using Expo, use expo/fetch to expand support for Event Iterator:

export const link = new RPCLink({
  url: `http://localhost:3000/rpc`,
  async fetch(request, init) {
    const { fetch } = await import('expo/fetch')

    const resp = await fetch(request.url, {
      body: await request.blob(),
      headers: request.headers,
      method: request.method,
      signal: request.signal,
      ...init,
    })

    return resp
  },
})