Pipe Recorder Introduction

The Pipe Recorder is a fast, user-friendly, resilient HTML & JS library for recording audio, video, the screen and uploading existing recordings.

It works in all major browsers on desktop and mobile.

UI/UX #

By default, it uses the same UI/experience across mobile and desktop devices. On mobile devices, a separate older recording UI/experience exists which is now turned off by default and documented as the Legacy Mobile Recorder.

Embedding #

Emebdding the Pipe Recorder in your web site or web app is simple. You copy and paste the 2.0 HTML or JS embed code available on the account dashboard’s embed page or use the npm package.

Device selector #

The microphone and webcam device selector in the Pipe Recorder:

• updates its list as devices are connected or disconnected
• shows a small notification icon when a device is added or removed
• keeps disconnected devices in the list, marked as removed

To learn more about how much weight the device selector carries, see our blog post on the topic: Building the Best Camera & Microphone Selector.

Real-time streaming #

When recording from the camera or microphone, or capturing the screen, the Pipe Recorder streams data in real time over a secure WebSocket connection to our ingestion media servers. Streaming begins the moment the user starts recording, so over a good Internet connection there is no upload wait when they stop.

Automatic reconnection #

If the connection to our ingestion server drops, the Pipe Recorder attempts to reconnect up to 30 times over a period of up to 7.5 minutes. Recording continues locally throughout, and buffered data is uploaded once the connection is re-established.

Server-side recovery #

Recordings that were not fully streamed (for example, because the user disconnected completely) are recovered and processed on our servers.

Availability zone fallback #

The Pipe Recorder falls back between the two availaiblity zones of our US and EU regions on the initial connection: if it can’t reach the designated availability zones, it tries the second one.

Multiple recorders on the same page #

With our 2.0 JS/HTML embed code, you can add multiple recorders to the same page or in the same form.

Accessible #

We’re committed to making the Pipe Recorder accessible and currently adhere to the WCAG AA conformance level.