export class SrsRTC { constructor(url){ this.stream = new MediaStream(); this.url = url; this.offer = null; this.pc =null; // this.pc = new RTCPeerConnection(null); // this.pc.ontrack = (event) => { // // https://webrtc.org/getting-started/remote-streams // console.warn('event',event.track) // if(this.stream){ // this.stream.addTrack(event.track); // } // }; } close(){ this.pc && this.pc.close(); this.pc = null; } async getVideo(clipUrl){ if(!this.pc){ this.pc = new RTCPeerConnection(null); this.pc.ontrack = (event) => { // https://webrtc.org/getting-started/remote-streams console.log('event',event.track) if(this.stream){ // this.stream.removeTrack(event.track)); const videoTrack = this.stream.getVideoTracks().find(i=>i.kind ==='video') console.log('videoTrack',videoTrack) if(videoTrack){ this.stream.removeTrack(videoTrack); } // if(this.stream.removeTrack()) this.stream.addTrack(event.track); } }; } this.pc.addTransceiver("video", {direction: "recvonly"}); const serverApi ='https://demo-kms.4dage.com:443/rtc/v1/play/'; const tid = Number(parseInt(new Date().getTime()*Math.random()*100)).toString(16).slice(0, 7); var offer = await this.pc.createOffer(); this.offer = offer; await this.pc.setLocalDescription(offer); const session = await new Promise(function(resolve, reject) { // @see https://github.com/rtcdn/rtcdn-draft var data = { api: serverApi, tid: tid, streamurl: clipUrl, clientip: null, sdp: offer.sdp }; console.log("Generated offer: ", data); $.ajax({ type: "POST", url: serverApi, data: JSON.stringify(data), contentType:'application/json', dataType: 'json' }).done(function(data) { console.log("Got answer: ", data); if (data.code) { reject(data); return; } resolve(data); }).fail(function(reason){ reject(reason); }); }); await this.pc.setRemoteDescription( new RTCSessionDescription({type: 'answer', sdp: session.sdp}) ); return session; } }