trtcInit.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. import { Connection } from "./webrtc/connection.js";
  2. import { uuid } from "./webrtc/uuid.js";
  3. document.addEventListener("DOMContentLoaded", async () => {
  4. const connection = new Connection();
  5. window.connection = connection;
  6. const testConfig = {
  7. userId: uuid(16, 16),
  8. roomId: "22s1111ss",
  9. sdkAppId: 1400653314,
  10. sceneCode: "2111",
  11. };
  12. console.log("testConfig", testConfig);
  13. connection.init(testConfig, async () => {
  14. if (connection.client) {
  15. await connection.client.join({ roomId: testConfig.roomId });
  16. console.log("userSig", connection.userSig);
  17. // connection.socket.on("init-scene", {
  18. // videos: ["0/0_1_0", "1/0_2_0"],
  19. // range: [start, end],
  20. // isRotate: true,
  21. // });
  22. connection.socket.emit("getPush", {
  23. userId: testConfig.userId,
  24. roomId: testConfig.roomId,
  25. sceneCode: testConfig.sceneCode,
  26. userSig: connection.userSig,
  27. });
  28. connection.socket.on("getPush", (data) => {
  29. console.log(
  30. "getPush",
  31. `ffmpeg -loglevel info -re -stream_loop -1 -i output.mp4 -c:v libx264 -preset fast -profile:v baseline -g 30 -sc_threshold 0 -b:v 1500k -f flv "${data}"`
  32. );
  33. });
  34. connection.socket.emit("init-webrtc");
  35. console.log("connection.client", connection.client);
  36. connection.client.on("peer-join", (event) => {
  37. console.log("peer-join", event);
  38. });
  39. connection.client.on("client-banned", () => {
  40. location.reload();
  41. });
  42. connection.client.on("stream-added", (event) => {
  43. const remoteStream = event.stream;
  44. const remoteUserId = remoteStream.getUserId();
  45. console.warn("stream-added", remoteStream);
  46. console.warn(
  47. "received a remoteStream ID: " +
  48. remoteStream.getId() +
  49. " from user: " +
  50. remoteUserId
  51. );
  52. // 若需要观看该远端流,则需要订阅它
  53. connection.client.subscribe(remoteStream);
  54. });
  55. // connection.client.on('network-quality', event => {
  56. // console.log(`network-quality, uplinkNetworkQuality:${event.uplinkNetworkQuality}, downlinkNetworkQuality: ${event.downlinkNetworkQuality}`)
  57. // // 自 v4.10.3 支持获取上、下行的 RTT 及丢包率
  58. // console.log(`uplink rtt:${event.uplinkRTT} loss:${event.uplinkLoss}`)
  59. // console.log(`downlink rtt:${event.downlinkRTT} loss:${event.downlinkLoss}`)
  60. // })
  61. connection.client.on("stream-subscribed", (event) => {
  62. const remoteStream = event.stream;
  63. // 远端流订阅成功,在HTML页面中创建一个<video>标签,假设该标签ID为‘remote-video-view’
  64. // 播放该远端流
  65. // console.log("remoteStream", remoteStream);
  66. // remoteStream.resume();
  67. remoteStream.play("testVideoFeed");
  68. const frame = remoteStream.getVideoFrame();
  69. const track = remoteStream.getVideoTrack();
  70. console.warn("frame", frame, track);
  71. console.warn("frame", remoteStream);
  72. });
  73. connection.client.on("error", (event) => {
  74. console.log("error", event);
  75. });
  76. connection.client.on("connection-state-changed", (event) => {
  77. console.warn("connection-state-changed", event);
  78. });
  79. // 监听‘stream-removed’事件
  80. connection.client.on("stream-removed", (event) => {
  81. const remoteStream = event.stream;
  82. console.log(
  83. "remoteStream ID: " +
  84. remoteStream.getId() +
  85. " has been removed"
  86. );
  87. // 停止播放并删除相应<video>标签
  88. });
  89. // 监听‘stream-updated’事件
  90. connection.client.on("stream-updated", (event) => {
  91. const remoteStream = event.stream;
  92. console.warn(
  93. "remoteStream ID: " +
  94. remoteStream.getId() +
  95. " was updated hasAudio: " +
  96. remoteStream.hasAudio() +
  97. " hasVideo: " +
  98. remoteStream.hasVideo()
  99. );
  100. });
  101. // 监听‘stream-subscribed’事件
  102. }
  103. });
  104. });