Alexey Khit
65 lines
1.6 KiB
HTML
65 lines
1.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>go2rtc - WebRTC</title>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
html, body {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
|
|
#video {
|
|
/* video "container" size */
|
|
width: 100%;
|
|
height: 100%;
|
|
background: black;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- muted is important for autoplay -->
|
|
<video id="video" autoplay controls playsinline muted></video>
|
|
<script>
|
|
// support api_path
|
|
const baseUrl = location.origin + location.pathname.substr(
|
|
0, location.pathname.lastIndexOf("/")
|
|
);
|
|
|
|
const pc = new RTCPeerConnection({
|
|
iceServers: [
|
|
{urls: 'stun:stun.l.google.com:19302'},
|
|
]
|
|
});
|
|
|
|
pc.addEventListener('icegatheringstatechange', async () => {
|
|
if (pc.iceGatheringState !== 'complete') return;
|
|
|
|
let r = await fetch(`${baseUrl}/api/webrtc${location.search}`, {
|
|
method: 'POST', body: pc.localDescription.sdp,
|
|
});
|
|
await pc.setRemoteDescription({
|
|
type: 'answer', sdp: await r.text()
|
|
});
|
|
});
|
|
pc.addEventListener('track', ev => {
|
|
let video = document.getElementById('video');
|
|
if (video.srcObject === null) {
|
|
video.srcObject = ev.streams[0];
|
|
}
|
|
});
|
|
|
|
pc.addTransceiver('video', {direction: 'recvonly'});
|
|
pc.addTransceiver('audio', {direction: 'recvonly'});
|
|
|
|
pc.createOffer().then(offer => {
|
|
pc.setLocalDescription(offer);
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |