@eyevinn/whip-web-client
Advanced tools
A browser library / SDK for WebRTC ingest from mobile or browser using the WebRTC HTTP Ingestion Protocol (WHIP).
Example codes:
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);
Available options are:
{
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
}
}
Download the latest release and include the javascript files in your HTML.
<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>
npm run build:docs
Eyevinn Technology is an independent consultant firm specialized in video and streaming. Independent in a way that we are not commercially tied to any platform or technology vendor.
At Eyevinn, every software developer consultant has a dedicated budget reserved for open source development and contribution to the open source community. This give us room for innovation, team building and personal competence development. And also gives us as a company a way to contribute back to the open source community.
Want to know more about Eyevinn and how it is to work here. Contact us at work@eyevinn.se!
FAQs
WebRTC HTTP ingestion protocol web client SDK
We found that @eyevinn/whip-web-client demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
In this segment of the Risky Business podcast, Feross Aboukhadijeh and Patrick Gray discuss the challenges of tracking malware discovered in open source softare.
Research
Security News
A threat actor's playbook for exploiting the npm ecosystem was exposed on the dark web, detailing how to build a blockchain-powered botnet.
Security News
NVD’s backlog surpasses 20,000 CVEs as analysis slows and NIST announces new system updates to address ongoing delays.