srsRtc copy.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. export class SrsRTC {
  2. constructor(url) {
  3. this.stream = new MediaStream();
  4. this.url = url;
  5. this.offer = null;
  6. this.pc = null;
  7. this.pc = new RTCPeerConnection(null);
  8. // this.pc.ontrack = (event) => {
  9. // // https://webrtc.org/getting-started/remote-streams
  10. // console.warn('event',event.track)
  11. // if(this.stream){
  12. // this.stream.addTrack(event.track);
  13. // }
  14. // };
  15. }
  16. close() {
  17. var remoteVideo = document.querySelector("#testVideoFeed");
  18. if (remoteVideo.srcObject) {
  19. remoteVideo.srcObject.getTracks().forEach((track) => track.stop());
  20. }
  21. this.pc && this.pc.close();
  22. this.pc = null;
  23. }
  24. start() {}
  25. async getVideo(clipUrl) {
  26. if (!this.pc) {
  27. this.pc = new RTCPeerConnection(null);
  28. this.pc.ontrack = (event) => {
  29. // https://webrtc.org/getting-started/remote-streams
  30. console.log("event", event);
  31. if (this.stream) {
  32. // this.stream.removeTrack(event.track));
  33. const videoTrack = this.stream
  34. .getVideoTracks()
  35. .find((i) => i.kind === "video");
  36. console.log("旧videoTrack", videoTrack);
  37. if (videoTrack) {
  38. this.stream.removeTrack(videoTrack);
  39. }
  40. // if(this.stream.removeTrack())
  41. this.stream.addTrack(event.track);
  42. }
  43. // mediaRecorder.
  44. };
  45. this.pc.ondatachannel = (event) => {
  46. console.log("ondatachannel", ondatachannel);
  47. this.inputChannel.onopen = () => {
  48. console.log("连接");
  49. };
  50. this.inputChannel.onmessage = (event) => {
  51. // mark00 rtcp接收
  52. console.log("连接", event);
  53. };
  54. this.inputChannel.close = (event) => {
  55. // mark00 rtcp接收
  56. console.log("close", event);
  57. };
  58. };
  59. }
  60. this.pc.addTransceiver("video", { direction: "recvonly" });
  61. const serverApi = "https://demo-kms.4dage.com:443/rtc/v1/play/";
  62. const tid = Number(parseInt(new Date().getTime() * Math.random() * 100))
  63. .toString(16)
  64. .slice(0, 7);
  65. var offer = await this.pc.createOffer();
  66. this.offer = offer;
  67. await this.pc.setLocalDescription(offer);
  68. const session = await new Promise(function (resolve, reject) {
  69. // @see https://github.com/rtcdn/rtcdn-draft
  70. var data = {
  71. api: serverApi,
  72. tid: tid,
  73. streamurl: clipUrl,
  74. clientip: null,
  75. sdp: offer.sdp,
  76. };
  77. console.log("Generated offer: ", data);
  78. $.ajax({
  79. type: "POST",
  80. url: serverApi,
  81. data: JSON.stringify(data),
  82. contentType: "application/json",
  83. dataType: "json",
  84. })
  85. .done(function (data) {
  86. console.log("Got answer: ", data);
  87. if (data.code) {
  88. reject(data);
  89. return;
  90. }
  91. resolve(data);
  92. })
  93. .fail(function (reason) {
  94. reject(reason);
  95. });
  96. });
  97. await this.pc.setRemoteDescription(
  98. new RTCSessionDescription({ type: "answer", sdp: session.sdp })
  99. );
  100. return session;
  101. }
  102. }