trtc-cloud-js-sdk 1.0.13 → 2.0.0

package/src/utils/environment.js

@@ -0,0 +1,297 @@
+// import logger from './log/logger';
+import { isUndefined } from './utils';
+
+export const USER_AGENT = (window.navigator && window.navigator.userAgent) || '';
+const webkitVersionMap = /AppleWebKit\/([\d.]+)/i.exec(USER_AGENT);
+const appleWebkitVersion = webkitVersionMap ? parseFloat(webkitVersionMap.pop()) : null;
+/*
+ * Device is an iPhone
+ *
+ * @type {Boolean}
+ * @constant
+ * @private
+ */
+export const IS_IPAD = /iPad/i.test(USER_AGENT);
+
+// The Facebook app's UIWebView identifies as both an iPhone and iPad, so
+// to identify iPhones, we need to exclude iPads.
+// http://artsy.github.io/blog/2012/10/18/the-perils-of-ios-user-agent-sniffing/
+export const IS_IPHONE = /iPhone/i.test(USER_AGENT) && !IS_IPAD;
+export const IS_IPOD = /iPod/i.test(USER_AGENT);
+export const IS_IOS = IS_IPHONE || IS_IPAD || IS_IPOD;
+
+export const IOS_VERSION =  IS_IOS
+  && (function () {
+    const match = USER_AGENT.match(/OS (\d+)_/i);
+
+    if (match && match[1]) {
+      return match[1];
+    }
+    return null;
+  }());
+
+export const IS_ANDROID = /Android/i.test(USER_AGENT);
+export const ANDROID_VERSION =  IS_ANDROID
+  && (function () {
+    // This matches Android Major.Minor.Patch versions
+    // ANDROID_VERSION is Major.Minor as a Number, if Minor isn't available, then only Major is returned
+    const match = USER_AGENT.match(/Android (\d+)(?:\.(\d+))?(?:\.(\d+))*/i);
+
+    if (!match) {
+      return null;
+    }
+
+    const major = match[1] && parseFloat(match[1]);
+    const minor = match[2] && parseFloat(match[2]);
+
+    if (major && minor) {
+      return parseFloat(`${match[1]}.${match[2]}`);
+    } if (major) {
+      return major;
+    }
+    return null;
+  }());
+
+// Old Android is defined as Version older than 2.3, and requiring a webkit version of the android browser
+export const IS_OLD_ANDROID = IS_ANDROID && /webkit/i.test(USER_AGENT) && ANDROID_VERSION < 2.3;
+export const IS_NATIVE_ANDROID = IS_ANDROID && ANDROID_VERSION < 5 && appleWebkitVersion < 537;
+
+// Firefox
+export const IS_FIREFOX = /Firefox/i.test(USER_AGENT);
+export const FIREFOX_VERSION =  IS_FIREFOX
+  && (function () {
+    const match = USER_AGENT.match(/Firefox\/(\d+)/);
+    if (match && match[1]) {
+      return parseFloat(match[1]);
+    }
+    return null;
+  }());
+
+// old Edge
+export const IS_EDGE = /Edge\//i.test(USER_AGENT);
+export const EDGE_VERSION =  IS_EDGE
+  && (function () {
+    const match = USER_AGENT.match(/Edge\/(\d+)/i);
+    if (match && match[1]) {
+      return match[1];
+    }
+  }());
+// new Edge
+export const IS_EDG = /Edg\//i.test(USER_AGENT);
+export const EDG_VERSION =  IS_EDG
+  && (function () {
+    const match = USER_AGENT.match(/Edg\/(\d+)/);
+    if (match && match[1]) {
+      return parseFloat(match[1]);
+    }
+    return null;
+  }());
+
+// sogou mobile
+export const IS_SOGOUM = /SogouMobileBrowser\//i.test(USER_AGENT);
+export const SOGOUM_VERSION =  IS_SOGOUM
+  && (function () {
+    const match = USER_AGENT.match(/SogouMobileBrowser\/(\d+)/);
+    if (match && match[1]) {
+      return parseFloat(match[1]);
+    }
+    return null;
+  }());
+
+// sogou desktop
+export const IS_SOGOU = /MetaSr\s/i.test(USER_AGENT);
+export const SOGOU_VERSION =  IS_SOGOU
+  && (function () {
+    const match = USER_AGENT.match(/MetaSr(\s\d+(\.\d+)+)/);
+    if (match && match[1]) {
+      return parseFloat(match[1]);
+    }
+    return null;
+  }());
+
+export const IS_TBS = /TBS\/\d+/i.test(USER_AGENT); // 仅X5内核，QQ浏览器默认x5内核，但是agent没有TBS
+export const TBS_VERSION =  IS_TBS
+  && (function () {
+    const match = USER_AGENT.match(/TBS\/(\d+)/i);
+    if (match && match[1]) {
+      return match[1];
+    }
+  }()); // TBS内核版本
+
+export const IS_XWEB = /XWEB\/\d+/i.test(USER_AGENT);
+export const XWEB_VERSION =  IS_XWEB
+  && (function () {
+    const match = USER_AGENT.match(/XWEB\/(\d+)/i);
+    if (match && match[1]) {
+      return match[1];
+    }
+  }()); // XWEB内核版本
+
+// IE
+export const IS_IE8 = /MSIE\s8\.0/.test(USER_AGENT);
+export const IS_IE = /MSIE\/\d+/i.test(USER_AGENT);
+export const IE_VERSION =  IS_IE
+  && (function () {
+    const result = /MSIE\s(\d+)\.\d/.exec(USER_AGENT);
+    let version = result && parseFloat(result[1]);
+
+    if (!version && /Trident\/7.0/i.test(USER_AGENT) && /rv:11.0/.test(USER_AGENT)) {
+      // IE 11 has a different user agent string than other IE versions
+      version = 11.0;
+    }
+
+    return version;
+  }());
+
+export const IS_WECHAT = /(micromessenger|webbrowser)/i.test(USER_AGENT);
+export const WECHAT_VERSION =  IS_WECHAT
+  && (function () {
+    const match = USER_AGENT.match(/MicroMessenger\/(\d+)/i);
+    if (match && match[1]) {
+      return match[1];
+    }
+  }());
+
+export const IS_X5MQQB = !IS_TBS && /MQQBrowser\/\d+/i.test(USER_AGENT) && /COVC\/\d+/i.test(USER_AGENT); // 移动端 QQ X5 内核浏览器
+export const IS_MQQB = !IS_TBS && /MQQBrowser\/\d+/i.test(USER_AGENT) && !/COVC\/\d+/i.test(USER_AGENT); // 移动端 QQ 浏览器
+export const MQQB_VERSION =  (IS_MQQB || IS_X5MQQB)
+  && (function () {
+    const match = USER_AGENT.match(/ MQQBrowser\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+
+export const IS_WQQB = !IS_TBS && / QQBrowser\/\d+/i.test(USER_AGENT); // windows端QQ浏览器
+export const WQQB_VERSION =  IS_WQQB
+  && (function () {
+    const match = USER_AGENT.match(/ QQBrowser\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+
+export const IS_MACQQB = !IS_TBS && /QQBrowserLite\/\d+/i.test(USER_AGENT); // Mac端QQ浏览器
+export const MACQQB_VERSION =  IS_MACQQB
+  && (function () {
+    const match = USER_AGENT.match(/QQBrowserLite\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+
+export const IS_IPADQQB = !IS_TBS && /MQBHD\/\d+/i.test(USER_AGENT); // iPad端QQ浏览器
+export const IPADQQB_VERSION =  IS_IPADQQB
+  && (function () {
+    const match = USER_AGENT.match(/MQBHD\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+
+export const IS_WIN = /Windows/i.test(USER_AGENT); // window系统
+export const IS_MAC = !IS_IOS && /MAC OS X/i.test(USER_AGENT); // MAC系统，先检查IOS
+export const IS_LINUX = !IS_ANDROID && /Linux/i.test(USER_AGENT);
+export const IS_WX = /MicroMessenger/i.test(USER_AGENT); // 是否为微信环境
+export const IS_UCBROWSER = /UCBrowser/i.test(USER_AGENT);
+export const IS_ELECTRON = /Electron/i.test(USER_AGENT); // 是否为 electron
+
+export const IS_MIBROWSER = /MiuiBrowser/i.test(USER_AGENT); // 小米浏览器
+export const MI_VERSION =  IS_MIBROWSER
+  && (function () {
+    const match = USER_AGENT.match(/MiuiBrowser\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+export const IS_HUAWEIBROWSER = /HuaweiBrowser/i.test(USER_AGENT); // 华为浏览器
+export const IS_HUAWEI = /Huawei/i.test(USER_AGENT); // 华为设备
+export const HUAWEI_VERSION =  IS_HUAWEIBROWSER
+  && (function () {
+    const match = USER_AGENT.match(/HuaweiBrowser\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+
+export const IS_SAMSUNGBROWSER = /SamsungBrowser/i.test(USER_AGENT); // 三星浏览器
+export const SAMSUNG_VERSION =  IS_SAMSUNGBROWSER
+  && (function () {
+    const match = USER_AGENT.match(/SamsungBrowser\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+export const IS_OPPOBROWSER = /HeyTapBrowser/i.test(USER_AGENT); // OPPO浏览器
+export const OPPO_VERSION =  IS_OPPOBROWSER
+  && (function () {
+    const match = USER_AGENT.match(/HeyTapBrowser\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+export const IS_VIVOBROWSER = /VivoBrowser/i.test(USER_AGENT); // OPPO浏览器
+export const VIVO_VERSION =  IS_VIVOBROWSER
+  && (function () {
+    const match = USER_AGENT.match(/VivoBrowser\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+
+// Chrome
+export const IS_CHROME_ONLY = /Chrome/i.test(USER_AGENT);
+export const IS_CHROME =  !IS_EDGE
+  && !IS_SOGOU
+  && !IS_SOGOUM
+  && !IS_TBS
+  && !IS_XWEB
+  && !IS_EDG
+  && !IS_WQQB
+  && !IS_MIBROWSER
+  && !IS_HUAWEIBROWSER
+  && !IS_SAMSUNGBROWSER
+  && !IS_OPPOBROWSER
+  && !IS_VIVOBROWSER
+  && /Chrome/i.test(USER_AGENT);
+export const CHROME_MAJOR_VERSION =  IS_CHROME
+  && (function () {
+    const match = USER_AGENT.match(/Chrome\/(\d+)/);
+
+    if (match && match[1]) {
+      return parseFloat(match[1]);
+    }
+    return null;
+  }());
+export const CHROME_VERSION =  IS_CHROME
+  && (function () {
+    const match = USER_AGENT.match(/Chrome\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+
+// Safari
+export const IS_SAFARI = !IS_CHROME_ONLY && !IS_MQQB && !IS_X5MQQB && !IS_MACQQB && !IS_IPADQQB && /Safari/i.test(USER_AGENT);
+export const IS_ANY_SAFARI = IS_SAFARI || IS_IOS;
+export const SAFARI_VERSION =  IS_SAFARI
+  && (function () {
+    const match = USER_AGENT.match(/Version\/([\d.]+)/);
+    if (match && match[1]) return match[1];
+    return null;
+  }());
+
+//
+export const BROWSER_VERSION = IS_CHROME ? `Chrome/${CHROME_VERSION}` : IS_SAFARI ? `Safari/${SAFARI_VERSION}` : 'NotSupportedBrowser';
+
+// 是否本地环境 file, localhost, ip 地址
+export const IS_LOCAL = location.protocol === 'file:' || location.hostname === 'localhost' || /^\d+\.\d+\.\d+\.\d+$/.test(location.hostname);
+
+/**
+ * 检测 LocalStorage 是否可用
+ * @export
+ * @return {Boolean}
+ */
+export const isLocalStorageEnabled = (() => {
+  let result;
+  return () => {
+    if (isUndefined(result)) {
+      try {
+        result = window.localStorage;
+      } catch (error) {
+        result = false;
+      }
+    }
+    return result;
+  };
+})();

package/src/utils/raf.js

@@ -0,0 +1,131 @@
+/* eslint-disable no-underscore-dangle */
+import generateUUID from './uuid';
+import { performanceNow } from './utils';
+
+/**
+ * 基于 requestAnimationFrame 实现类 setInterval  的功能
+ * @class RAF
+ */
+class RAF {
+  constructor() {
+    // Map<intervalId, { rafId, timeoutId, onVisibilityChange}>
+    // rafId: requestAnimationFrame 返回的 id
+    // timeoutId: setTimeout 返回的 id。在页面隐藏时，使用 setTimeout 作为 requestAnimationFrame 的 backup
+    // onVisibilityChange: 监听页面可视性变更的回调，保存该回调是用于在结束 interval 时注销监听。
+    this.intervalMap_ = new Map();
+  }
+
+  /**
+   * 基于 requestAnimationFrame 实现类 setInterval  的功能
+   * 当页面隐藏时，会用 setTimeout 作为 backup
+   * @param {function} fn
+   * @param {number} interval 时间间隔
+   * @param {boolean} [enableInBackground=true] 当页面切换到后台时，是否执行 interval
+   * @return {string} intervalId
+   * @memberof RAF
+   */
+  setInterval(fn, interval, enableInBackground = true) {
+    const intervalId = generateUUID();
+    let startTime = performanceNow();
+    let endTime = startTime;
+
+    this.intervalMap_.set(intervalId, {
+      rafId: null,
+      timeoutId: null,
+      onVisibilityChange: null,
+    });
+
+    const rafLoop = () => {
+      // 当页面隐藏时，用 setTimeout 作为 backup
+      if (enableInBackground && document.hidden) {
+        fn();
+        const timeoutId = setTimeout(rafLoop, interval);
+        this.setTimeoutId(intervalId, timeoutId);
+        startTime = performanceNow();
+        endTime = startTime;
+      } else {
+        endTime = performanceNow();
+        if (endTime - startTime >= interval) {
+          startTime = endTime;
+          fn();
+        }
+        const rafId = requestAnimationFrame(rafLoop);
+
+        this.setRafId(intervalId, rafId);
+      }
+    };
+    const rafId = requestAnimationFrame(rafLoop);
+    this.setRafId(intervalId, rafId);
+
+    // 当页面隐藏时，用 setTimeout 作为 backup
+    if (enableInBackground) {
+      const onVisibilityChange = () => {
+        if (document.hidden) {
+          const span = performanceNow() - startTime;
+          // 页面隐藏时，距离上次回调执行完的间隔超过 interval，则立即执行 rafLoop
+          if (span >= interval) {
+            rafLoop();
+          } else {
+            // 页面隐藏时，未达 interval，则在 interval - span 后执行 rafLoop
+            const timeoutId = setTimeout(rafLoop, interval - span);
+            this.setTimeoutId(intervalId, timeoutId);
+          }
+        }
+      };
+      document.addEventListener('visibilitychange', onVisibilityChange);
+      this.setOnVisibilityChange(intervalId, onVisibilityChange);
+    }
+
+    return intervalId;
+  }
+
+  /**
+   * 清除 interval
+   * @param {string} intervalId
+   * @memberof RAF
+   */
+  clearInterval(intervalId) {
+    if (this.intervalMap_.has(intervalId)) {
+      const { rafId, timeoutId, onVisibilityChange } = this.intervalMap_.get(intervalId);
+      cancelAnimationFrame(rafId);
+      clearTimeout(timeoutId);
+      document.removeEventListener('visibilitychange', onVisibilityChange);
+      this.intervalMap_.delete(intervalId);
+    }
+  }
+
+  setTimeoutId(intervalId, timeoutId) {
+    if (this.intervalMap_.has(intervalId)) {
+      const value = this.intervalMap_.get(intervalId);
+      // 在设置新的 timeout 之前，需清理先前的 timeout
+      // 避免来回切换 tab 时，重复设置
+      if (value.timeoutId) {
+        clearTimeout(value.timeoutId);
+      }
+      value.timeoutId = timeoutId;
+    }
+  }
+
+  setRafId(intervalId, rafId) {
+    if (this.intervalMap_.has(intervalId)) {
+      const value = this.intervalMap_.get(intervalId);
+      // 在设置新的 requestAnimationFrame 之前，需清理先前设置的 raf
+      // 避免来回切换 tab 时，重复设置
+      if (value.rafId) {
+        cancelAnimationFrame(value.rafId);
+      }
+      value.rafId = rafId;
+    }
+  }
+
+  setOnVisibilityChange(intervalId, onVisibilityChange) {
+    if (this.intervalMap_.has(intervalId)) {
+      const value = this.intervalMap_.get(intervalId);
+      value.onVisibilityChange = onVisibilityChange;
+    }
+  }
+}
+
+const raf = new RAF();
+
+export default raf;

package/src/utils/time.js

@@ -0,0 +1,22 @@
+// user system clock may be inaccurate, so we need to adjust the timestamp
+// based on the baseTime received from remote server
+
+let baseTime = new Date().getTime();
+let offset = 0;
+
+export const setBaseTime = function (time) {
+  baseTime = time;
+  offset = baseTime - new Date().getTime();
+  const base = new Date();
+  base.setTime(time);
+};
+
+export const getCurrentTime = function () {
+  return new Date().getTime() + offset;
+};
+
+export const getTimestamp = function () {
+  const now = new Date();
+  now.setTime(getCurrentTime());
+  return now.toLocaleString();
+};

package/src/utils/utils.ts

@@ -0,0 +1,71 @@
+/**
+ * 获取向下取整的 performance.now() 值
+ * @export
+ * @return {Number}
+ */
+// eslint-disable-next-line require-jsdoc
+export function performanceNow() {
+  return Math.floor(performance.now());
+}
+
+export const isFunction = (param: any) => typeof param === 'function';
+export const isUndefined = (param: any) => typeof param === 'undefined';
+export const isString = (param: any) => typeof param === 'string';
+export const isNumber = (param: any) => typeof param === 'number';
+export const isBoolean = (param: any) => typeof param === 'boolean';
+
+/**
+ *  mixins class
+ */
+export function MixinsClass(...mixins: any[]): any {
+  class MixClass {
+    constructor() {
+      // eslint-disable-next-line no-restricted-syntax
+      for (const Mixin of mixins) {
+        copyProperties(this, new Mixin(this)); // 拷贝实例属性 同时执行内部初始化
+      }
+    }
+  }
+  const proto = MixClass.prototype;
+  // eslint-disable-next-line no-restricted-syntax
+  for (const mixin of mixins) {
+    copyProperties(MixClass, mixin); // 拷贝静态属性
+    copyProperties(proto, mixin.prototype); // 拷贝原型属性
+  }
+  return MixClass;
+}
+
+/**
+ *
+ * @param target
+ * @param source
+ */
+function copyProperties(target: any, source: any) {
+  // eslint-disable-next-line no-restricted-syntax
+  for (const key of Reflect.ownKeys(source)) {
+    if (key !== 'constructor' && key !== 'prototype' && key !== 'name') {
+      const desc = Object.getOwnPropertyDescriptor(source, key) || '';
+      Object.defineProperty(target, key, desc);
+    }
+  }
+}
+
+/**
+ * 防抖函数
+ * @param {Function} fn 要执行的函数
+ * @param {Number} delay 间隔时间, 毫秒
+ * @returns function
+ */
+// eslint-disable-next-line no-unused-vars
+export function debounce(fn: { apply: (arg0: any, arg1: any) => void; }, delay: number | undefined) {
+  let timer: number;
+  return function (this:any, ...args: any) {
+    if (timer > 0) {
+      clearTimeout(timer);
+    }
+    timer = window.setTimeout(() => {
+      fn.apply(this, args);
+      timer = -1;
+    }, delay);
+  };
+}

package/src/utils/uuid.js

@@ -0,0 +1,12 @@
+/**
+ *  UUID generator - RFC4122 version 4 compliant solution
+ */
+ const generateUUID = function () {
+  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
+    const r = (Math.random() * 16) | 0;
+    const v = c === 'x' ? r : (r & 0x3) | 0x8;
+    return v.toString(16);
+  });
+};
+
+export default generateUUID;

package/test/unit/env.test.js

@@ -0,0 +1,25 @@
+import log from '../../src/utils/log/logger';
+import * as env from '../../src/utils/environment';
+import * as rtcDetection from '../../src/rtc/rtc-detection';
+
+describe('environment & rtc-detection unit test', () => {
+  it('environment works as expected', () => {
+    const isChrome = env.IS_CHROME;
+    log.debug(`isChrome:${isChrome} Version: ${env.CHROME_VERSION}`);
+    expect(isChrome).toBe(true);
+  });
+
+  it('rtc-detection works as expected', done => {
+    const isWebRTCSupported = rtcDetection.isWebRTCSupported();
+    expect(isWebRTCSupported).toBe(true);
+    const isUnifiedPlanDefault = rtcDetection.isUnifiedPlanDefault();
+    expect(isUnifiedPlanDefault).toBe(true);
+    const isScreenCaptureApiAvailable = rtcDetection.isScreenCaptureApiAvailable();
+    expect(isScreenCaptureApiAvailable).toBe(true);
+    rtcDetection.checkH264Support(supported => {
+      log.debug('h264Supported: ' + supported);
+      expect(supported).toBe(true);
+      done();
+    });
+  });
+});

package/test/unit/get-user-media.test.js

@@ -0,0 +1,40 @@
+import log from '../../src/utils/log/logger';
+import GetUserMedia from '../../src/rtc/get-user-media';
+
+describe('get-user-media.js: ', () => {
+  it('GetUserMedia works as expected', done => {
+    log.debug('testing GetUserMedia');
+    const gum = new GetUserMedia();
+    gum.getUserMedia(
+      { audio: true, video: true },
+      stream => {
+        log.debug('getUserMedia got stream success');
+        expect(true).toBe(true);
+        done();
+      },
+      () => {
+        log.error('getUserMedia failed!');
+        expect(false).toBe(false);
+        done();
+      }
+    );
+  });
+
+  it('GetUserMedia with video attributes works as expected', done => {
+    log.debug('testing GetUserMedia');
+    const gum = new GetUserMedia();
+    gum.getUserMedia(
+      { audio: true, video: true, width: 640, height: 480, frameRate: 15 },
+      stream => {
+        log.debug('getUserMedia got stream success');
+        expect(true).toBe(true);
+        done();
+      },
+      () => {
+        log.error('getUserMedia failed!');
+        expect(false).toBe(false);
+        done();
+      }
+    );
+  });
+});

package/test/unit/ice-parser.test.js

@@ -0,0 +1,23 @@
+import log from '../../src/utils/log/logger';
+import * as iceParser from '../../src/rtc/ice-candidate-parser';
+
+describe('ice-candidate-parser: ', () => {
+  it('iceParser works', () => {
+    log.debug('testing iceParser');
+    const hostCandidate =
+      'candidate:4211169504 1 udp 2122260223 10.73.47.64 56520 typ host generation 0 ufrag ulxL network-id 1 network-cost 10';
+    const srflxCandidate =
+      'candidate:1381947189 1 udp 1686052607 180.153.219.16 15826 typ srflx raddr 10.73.47.64 rport 56520 generation 0 ufrag ulxL network-id 1 network-cost 10';
+    const tcpCandidate =
+      'candidate:3045237776 1 tcp 1518280447 10.73.47.64 9 typ host tcptype active generation 0 ufrag ulxL network-id 1 network-cost 10';
+    const host = iceParser.parseIceCandidate(hostCandidate);
+    log.debug('host.type: ' + host.type);
+    expect(host.type).toBe(iceParser.IceType.HOST);
+    const srflx = iceParser.parseIceCandidate(srflxCandidate);
+    log.debug('srflx.type: ' + srflx.type);
+    expect(srflx.type).toBe(iceParser.IceType.SRFLX);
+    const tcp = iceParser.parseIceCandidate(tcpCandidate);
+    log.debug('tcp.transport: ' + tcp.transport);
+    expect(tcp.transport).toBe(iceParser.IceTransport.TCP);
+  });
+});