123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169 |
- export class SrsRTC {
- constructor(url) {
- this.stream = new MediaStream();
- this.url = url;
- this.offer = null;
- // this.pc = null;
- this.pc = new RTCPeerConnection({
- encodedInsertableStreams: true,
- });
- this.pc.addEventListener('icecandidate', e => this.onIceCandidate(this.pc, e));
- this.pc..addEventListener('datachannel', this.ondatachannel);
- // this.pc.ondatachannel = (event) => {
- // console.log("ondatachannel", ondatachannel);
- // this.inputChannel.onopen = () => {
- // console.log("连接");
- // };
- // this.inputChannel.onmessage = (event) => {
- // // mark00 rtcp接收
- // console.log("连接", event);
- // };
- // this.inputChannel.close = (event) => {
- // // mark00 rtcp接收
- // console.log("close", event);
- // };
- // };
- }
- onIceCandidate(event){
- console.log('icecandidate',event)
- }
- ondatachannel(event){
- console.log('ondatachannel',ondatachannel)
- }
- close() {
- var remoteVideo = document.querySelector("#testVideoFeed");
- if (remoteVideo.srcObject) {
- remoteVideo.srcObject.getTracks().forEach((track) => track.stop());
- }
- this.pc && this.pc.close();
- this.pc = null;
- }
- start(clipUrl) {
- 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 })
- );
- }
- 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);
- 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);
- }
- // mediaRecorder.
- };
- this.pc.ondatachannel = (event) => {
- console.log("ondatachannel", ondatachannel);
- this.inputChannel.onopen = () => {
- console.log("连接");
- };
- this.inputChannel.onmessage = (event) => {
- // mark00 rtcp接收
- console.log("连接", event);
- };
- this.inputChannel.close = (event) => {
- // mark00 rtcp接收
- console.log("close", event);
- };
- };
- }
- 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;
- }
- }
|