@arcware/webrtc-plugin

Arcware WebRTC Plugin

Javascript/Typescript module to connect any frontend to Unreal Engine 4 app with pixel streaming enabled through signalling WS.

Getting started

import { WebRTCClient } from "@arcware-cloud/webrtc-plugin";

const webrtc_client = new WebRTCClient(args);

// Vue template
<div ref="sizeContainer">
  <div ref="videoContainer">
    <video ref="videoRef" />
  </div>
</div>;

// React template
const sizeContainerRef = React.useRef();
const containerRef = React.useRef();
const videoRef = React.useRef();

<div ref={sizeContainerRef}>
  <div ref={containerRef}>
    <video ref={videoElRef} />
  </div>
</div>;

// Initialize WebRTC

const args = {
  address: "Signalling WS URL",
  packageName: "Name of the package (if there are multiple applications)",
  settings: {},
  // --- Containers Options ---
  // Vue
  sizeContainer: this.$refs.sizeContainer,
  container: this.$refs.videoContainer,
  videoRef: this.$refs.videoRef,
  // React
  sizeContainer: this.sizeContainerRef.current,
  container: this.containerRef.current,
  videoRef: this.videoRef.current,
  // ---  ---
  playOverlay: true, // Set default overlay with play button. Make it false and use loader
  loader: (val) => {}, // Callback for loading screen, etc. Once stream is ready, the function will be triggered with false value.
};

const webrtc = new WebRTCClient(args);
const emitUIInteraction = this.webrtc.emitUIInteraction;

Types and Props

Please follow to WebRTCClientProps interface exported from module to check properties types

SizeContainer, container and videoRef