LiveView for capturing audio and video from a browser and sending it via WebRTC to Membrane.WebRTC.Source.

Note: This module will be available in your code only if you add {:phoenix, "~> 1.7"} and {:phoenix_live_view, "~> 1.0"} to the dependencies of of your root project.

It:

• creates WebRTC PeerConnection on the browser side.
• forwards signaling messages between the browser and Membrane.WebRTC.Source via Membrane.WebRTC.Signaling.
• sends audio and video streams to the related Membrane.WebRTC.Source.

JavaScript Hook

Capture LiveView requires JavaScript hook to be registered under Capture name. The hook can be created using createCaptureHook function. For example:

import { createCaptureHook } from "membrane_webrtc_plugin";
let Hooks = {};
const iceServers = [{ urls: "stun:stun.l.google.com:19302" }];
Hooks.Capture = createCaptureHook(iceServers);
let liveSocket = new LiveSocket("/live", Socket, {
  // ...
  hooks: Hooks
});copy

Examples

defmodule StreamerWeb.StreamSenderLive do
  use StreamerWeb, :live_view

  alias Membrane.WebRTC.Live.Capture

  @impl true
  def render(assigns) do
  ~H"""
  <Capture.live_render socket={@socket} capture_id="capture" />
  """
  end

  @impl true
  def mount(_params, _session, socket) do
    signaling = Membrane.WebRTC.Signaling.new()
    {:ok, _supervisor, _pipelne} = Membrane.Pipeline.start_link(MyPipeline, signaling: signaling)

    socket = socket |> Capture.attach(id: "capture", signaling: signaling)
    {:ok, socket}
  end
endcopy