ganzf
/
CTEQishou


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
							<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link rel="stylesheet" type="text/css" href="./css/index.css" />
		<title id="title"></title>
		<style>
		html, body {
		    height: 100%;
		}
		body {
		    margin: 0;
		}
		video {
		    width: 100%;
		    height: 100%;
		    position: absolute;
		    left: 0;
		    top: 0;
		    z-index: -1;
		}
		
		</style>
	</head>
	<body>
		<video id="localVideo" playsinline autoplay muted></video>
		
		    <div class="box">
		        <button id="startButton">Start</button>
		        <button id="callButton">Call</button>
		        <button id="hangupButton">Hang Up</button>
		    </div>
	</body>
	<script type="text/javascript" src="./js/lib/uniwebviewsdk.js"></script>
	<script>
	const startButton = document.getElementById('startButton');
	const callButton = document.getElementById('callButton');
	const hangupButton = document.getElementById('hangupButton');
	callButton.disabled = true;
	hangupButton.disabled = true;
	let localCandidata=null;
	startButton.addEventListener('click', start);
	callButton.addEventListener('click', call);
	hangupButton.addEventListener('click', hangup);
	
	
	const localVideo = document.getElementById('localVideo');
	
	
	localVideo.addEventListener('loadedmetadata', function () {
	    console.log(`Local video videoWidth: ${this.videoWidth}px,  videoHeight: ${this.videoHeight}px`);
	});
	
	
	
	let localStream;
	let pc1;
	let whipLocation;
	const offerOptions = {
	    offerToReceiveAudio: 1,
	    offerToReceiveVideo: 1
	};
	const configuration = {
	    iceServers: [
	        {
	            urls: "stun:stun.l.google.com:19302"
	        }
	    ]
	};
	
	
	async function start() {
	    console.log('Requesting local stream');
	    startButton.disabled = true;
	    try {
	        const stream = await navigator.mediaDevices.getUserMedia({ audio: true, video: { width: 1280, height: 720, frameRate: 30 } });
	        console.log('Received local stream');
	        localVideo.srcObject = stream;
	        localStream = stream;
	        callButton.disabled = false;
	    } catch (e) {
	        alert(`getUserMedia() error: ${e.name}`);
	    }
	}
	async function call() {
	    callButton.disabled = true;
	    hangupButton.disabled = false;
	    console.log('Starting call');
	    const videoTracks = localStream.getVideoTracks();
	    const audioTracks = localStream.getAudioTracks();
	    if (videoTracks.length > 0) {
	        console.log(`Using video device: ${videoTracks[0].label}`);
	    }
	    if (audioTracks.length > 0) {
	        console.log(`Using audio device: ${audioTracks[0].label}`);
	    }
	
	
	    console.log('RTCPeerConnection configuration:', configuration);
	    pc1 = new RTCPeerConnection(configuration);
	    console.log('Created local peer connection object pc1');
	    // pc1.addEventListener('icecandidate', e => onIceCandidate(pc1, e));
	    //pc1.onicegatheringstatechange = gatheringStateChange;
	    //pc1.addEventListener('iceconnectionstatechange', e => onIceStateChange(pc1, e));
	    localCandidata=[];
		pc1.onicecandidate = function (event) {
		  if (event.candidate){
			localCandidata.push(event.candidate);
			uni.postMessage({
				data: {
					data:localCandidata, // 发起方先发candidate
					type:34567111
				},
			});
		  }
		}
		pc1.onconnectionstatechange = function (ev) {
			uni.postMessage({
				data: {
					data:pc1.connectionState, // 发起方先发candidate
					type:34567
				},
			});
		}
		localStream.getTracks().forEach(track => pc1.addTrack(track, localStream));
	    console.log('Added local stream to pc1');
	
	
	    try {
	        console.log('pc1 createOffer start');
	        const offer = await pc1.createOffer(offerOptions);
			uni.postMessage({
			    data: {
			        data:offer, // 发起方先发candidate
					type:345671
			    },
			});
	        await pc1.setLocalDescription(offer);
	        const answer = await postSDPOffer("https://203.175.169.44:8443/live/user111.whip", pc1.localDescription.sdp);
	        uni.postMessage({
	            data: {
	                data:answer, // 发起方先发candidate
	        		type:345672
	            },
	        });
			await pc1.setRemoteDescription(answer);
			console.log('setRemoteDescription');
	        whipLocation = answer.location;
	        // await onCreateOfferSuccess(offer);
	    } catch (e) {
	        onCreateSessionDescriptionError(e);
	    }
	}
	
	async function postSDPOffer(url, sdp) {
	    let result = {
	        status: 0,
	        type: 'answer',
	    };
	    try {
	        const response = await fetch(url, {
	            method: 'POST',
	            headers: {
	                'Content-Type': 'application/sdp',
	                "video-bitrate": 2_000_000,
	                "video-keyint": 3,
	                "audio-bitrate": 64_000
	            },
	            body: sdp
	        });
	        result.status = response.status;
	        result.sdp = await response.text();
	        result.location = response.headers.get("Location");
			uni.postMessage({
			    data: {
			        data:JSON.stringify(result), // 发起方先发candidate
					type:345673
			    },
			});
	    } catch (error) {
	        result.error = error;
			uni.postMessage({
			    data: {
			        data:JSON.stringify(error), // 发起方先发candidate
					type:345674
			    },
			});
	    }
	
	
	    return result;
	}
	function hangup() {
	    console.log('Ending call');
	    pc1.close();
	    pc1 = null;
	    hangupButton.disabled = true;
	    callButton.disabled = false;
	    fetch(whipLocation, { method: "DELETE" });
	}
	
	window.onunload=releaseTack;
	</script>
	
</html>