WHIP 网络客户端

使用WebRTC HTTP摄入协议(WHIP)从移动或浏览器摄取WebRTC的浏览器库/SDK.

开始

示例代码 :

国家预防机制

import { WHIPClient } from "@eyevinn/whip-web-client"

const client = new WHIPClient({
  endpoint: "http://<host>/whip/broadcaster",
  opts: { debug: true, iceServers: [{ urls: "stun:stun.l.google.com:19320" }] }
});
await client.setIceServersFromEndpoint();

const videoIngest = document.querySelector<HTMLVideoElement>("video#ingest");
const mediaStream = await navigator.mediaDevices.getUserMedia({
  video: true,
  audio: true,
});
videoIngest.srcObject = mediaStream;
await client.ingest(mediaStream);

可用的选项有:

{
  endpoint: string, // URL to WHIP endpoint
  opts: {
    debug: boolean, // enable debug console logging
    iceServers: [ { urls: string, username?: string, credential?: string }], // list of STUN/TURN servers
    authkey: string, // authentication key for auth option requests
    noTrickleIce: boolean, // force to not use trickle ICE
    timeout: number, // configure a ice gathering timeout when not using trickle ICE
  }
}

光盘N

下载最新版本并在您的 HTML 中包含 javascript 文件 .

<html>
  <head><title>Webcam ingest</title></head>
  <body>
    <video autoplay muted>
    <script src="whip-client.js"></script>
    <script>
      document.addEventListener('DOMContentLoaded', function(event) {
        const client = new WHIPClient({
          endpoint: "http://<host>/whip/broadcaster",
        });
        const videoIngest = document.querySelector("video#ingest");
        navigator.mediaDevices.getUserMedia({ video: true, audio: true })
          .then(function(mediaStream) {
            videoIngest.srcObject = mediaStream;
            return client.ingest(mediaStream);
          })
          .then(function() {
            console.log("Ingesting");
          })
          .catch(function(err) {
            console.error(err);
          });
      });
    </script>
  </body>
</html>

构建 SDK 文档 :

npm run build:docs

关于 Eyevinn 技术

Eyevinn Technology是一家独立咨询公司,专门从事视频和流媒体制作. 独立的方式,我们不与任何平台或技术供应商进行商业联系.

在Eyevinn,每个软件开发者顾问都有专用预算,用于开源开发和对开源社区的贡献. 这为我们提供了创新、团队建设和个人能力发展的空间。 也给了我们公司一个为开放源码社区做出贡献的方法.

想知道更多关于"Eyevin" 和如何工作在这里。 联系我们 工作@ eyevin.se来啊!