import Head from "next/head"; import { useRouter } from "next/router" import React from "react" const WHEP_API_LOCATION = "/api/wish-server/whep" const Video = ({user}: {user: string}) => { const videoRef = React.createRef(); React.useEffect(() => { const peerConnection = new RTCPeerConnection() peerConnection.ontrack = function (event) { videoRef.current!.srcObject = event.streams[0] } peerConnection.addTransceiver('audio') peerConnection.addTransceiver('video') peerConnection.createOffer().then(async offer => { peerConnection.setLocalDescription(offer) const response = await fetch(WHEP_API_LOCATION, { method: 'POST', body: offer.sdp, headers: { Authorization: `Bearer ${user}`, 'Content-Type': 'application/sdp' } }) if (response.status >= 200 && response.status < 300) { const sdp = await response.text(); peerConnection.setRemoteDescription({ sdp, type: 'answer' }) } }) return function cleanup() { peerConnection.close() } }, [videoRef, user]) return