您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

BrowserCapabilities.js 13KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394
  1. import { BrowserDetection } from '@jitsi/js-utils';
  2. import { getLogger } from '@jitsi/logger';
  3. const logger = getLogger(__filename);
  4. /* Minimum required Chrome / Chromium version. This applies also to derivatives. */
  5. const MIN_REQUIRED_CHROME_VERSION = 72;
  6. const MIN_REQUIRED_SAFARI_VERSION = 14;
  7. const MIN_REQUIRED_IOS_VERSION = 14;
  8. // TODO: Move this code to js-utils.
  9. // NOTE: Now we are extending BrowserDetection in order to preserve
  10. // RTCBrowserType interface but maybe it worth exporting BrowserCapabilities
  11. // and BrowserDetection as separate objects in future.
  12. /**
  13. * Implements browser capabilities for lib-jitsi-meet.
  14. */
  15. export default class BrowserCapabilities extends BrowserDetection {
  16. /**
  17. * Creates new BrowserCapabilities instance.
  18. */
  19. constructor() {
  20. super();
  21. logger.info(`This appears to be ${this.getName()}, ver: ${this.getVersion()}`);
  22. }
  23. /**
  24. * Tells whether or not the <tt>MediaStream/tt> is removed from the <tt>PeerConnection</tt> and disposed on video
  25. * mute (in order to turn off the camera device). This is needed on Firefox because of the following bug
  26. * https://bugzilla.mozilla.org/show_bug.cgi?id=1735951
  27. *
  28. * @return {boolean} <tt>true</tt> if the current browser supports this strategy or <tt>false</tt> otherwise.
  29. */
  30. doesVideoMuteByStreamRemove() {
  31. return this.isChromiumBased() || this.isWebKitBased() || this.isFirefox();
  32. }
  33. /**
  34. * Checks if the current browser is Chromium based, i.e., it's either Chrome / Chromium or uses it as its engine,
  35. * but doesn't identify as Chrome.
  36. *
  37. * This includes the following browsers:
  38. * - Chrome and Chromium.
  39. * - Other browsers which use the Chrome engine, but are detected as Chrome, such as Brave and Vivaldi.
  40. * - Browsers which are NOT Chrome but use it as their engine, and have custom detection code: Opera, Electron
  41. * and NW.JS.
  42. * This excludes
  43. * - Chrome on iOS since it uses WKWebView.
  44. */
  45. isChromiumBased() {
  46. return (this.isChrome()
  47. || this.isElectron()
  48. || this.isNWJS()
  49. || this.isOpera())
  50. && !this.isWebKitBased();
  51. }
  52. /**
  53. * Checks if the current platform is iOS.
  54. *
  55. * @returns {boolean}
  56. */
  57. isIosBrowser() {
  58. const { userAgent, maxTouchPoints, platform } = navigator;
  59. return Boolean(userAgent.match(/iP(ad|hone|od)/i))
  60. || (maxTouchPoints && maxTouchPoints > 2 && /MacIntel/.test(platform));
  61. }
  62. /**
  63. * Checks if the current browser is WebKit based. It's either
  64. * Safari or uses WebKit as its engine.
  65. *
  66. * This includes Chrome and Firefox on iOS
  67. *
  68. * @returns {boolean}
  69. */
  70. isWebKitBased() {
  71. // https://trac.webkit.org/changeset/236144/webkit/trunk/LayoutTests/webrtc/video-addLegacyTransceiver.html
  72. return this._bowser.isEngine('webkit')
  73. && typeof navigator.mediaDevices !== 'undefined'
  74. && typeof navigator.mediaDevices.getUserMedia !== 'undefined'
  75. && typeof window.RTCRtpTransceiver !== 'undefined'
  76. // eslint-disable-next-line no-undef
  77. && Object.keys(RTCRtpTransceiver.prototype).indexOf('currentDirection') > -1;
  78. }
  79. /**
  80. * Checks whether current running context is a Trusted Web Application.
  81. *
  82. * @returns {boolean} Whether the current context is a TWA.
  83. */
  84. isTwa() {
  85. return 'matchMedia' in window && window.matchMedia('(display-mode:standalone)').matches;
  86. }
  87. /**
  88. * Checks if the current browser is supported.
  89. *
  90. * @returns {boolean} true if the browser is supported, false otherwise.
  91. */
  92. isSupported() {
  93. if (this.isSafari() && this._getSafariVersion() < MIN_REQUIRED_SAFARI_VERSION) {
  94. return false;
  95. }
  96. return (this.isChromiumBased() && this._getChromiumBasedVersion() >= MIN_REQUIRED_CHROME_VERSION)
  97. || this.isFirefox()
  98. || this.isReactNative()
  99. || this.isWebKitBased();
  100. }
  101. /**
  102. * Returns whether the browser is supported for Android
  103. * @returns {boolean} true if the browser is supported for Android devices
  104. */
  105. isSupportedAndroidBrowser() {
  106. return this.isChromiumBased() || this.isFirefox();
  107. }
  108. /**
  109. * Returns whether the browser is supported for iOS
  110. * @returns {boolean} true if the browser is supported for iOS devices
  111. */
  112. isSupportedIOSBrowser() {
  113. return this._getIOSVersion() >= MIN_REQUIRED_IOS_VERSION;
  114. }
  115. /**
  116. * Returns whether or not the current environment needs a user interaction
  117. * with the page before any unmute can occur.
  118. *
  119. * @returns {boolean}
  120. */
  121. isUserInteractionRequiredForUnmute() {
  122. return this.isFirefox() && this.isVersionLessThan('68');
  123. }
  124. /**
  125. * Checks if the current browser triggers 'onmute'/'onunmute' events when
  126. * user's connection is interrupted and the video stops playback.
  127. * @returns {*|boolean} 'true' if the event is supported or 'false'
  128. * otherwise.
  129. */
  130. supportsVideoMuteOnConnInterrupted() {
  131. return this.isChromiumBased() || this.isReactNative();
  132. }
  133. /**
  134. * Checks if the current browser reports upload and download bandwidth
  135. * statistics.
  136. * @return {boolean}
  137. */
  138. supportsBandwidthStatistics() {
  139. // FIXME bandwidth stats are currently not implemented for FF on our
  140. // side, but not sure if not possible ?
  141. return !this.isFirefox() && !this.isWebKitBased();
  142. }
  143. /**
  144. * Checks if the current browser supports setting codec preferences on the transceiver.
  145. * @returns {boolean}
  146. */
  147. supportsCodecPreferences() {
  148. return Boolean(window.RTCRtpTransceiver
  149. && 'setCodecPreferences' in window.RTCRtpTransceiver.prototype
  150. && window.RTCRtpReceiver
  151. && typeof window.RTCRtpReceiver.getCapabilities !== 'undefined')
  152. // this is not working on Safari because of the following bug
  153. // https://bugs.webkit.org/show_bug.cgi?id=215567
  154. && !this.isWebKitBased();
  155. }
  156. /**
  157. * Checks if the current browser support the device change event.
  158. * @return {boolean}
  159. */
  160. supportsDeviceChangeEvent() {
  161. return navigator.mediaDevices
  162. && typeof navigator.mediaDevices.ondevicechange !== 'undefined'
  163. && typeof navigator.mediaDevices.addEventListener !== 'undefined';
  164. }
  165. /**
  166. * Checks if the current browser supports the Long Tasks API that lets us observe
  167. * performance measurement events and be notified of tasks that take longer than
  168. * 50ms to execute on the main thread.
  169. */
  170. supportsPerformanceObserver() {
  171. return typeof window.PerformanceObserver !== 'undefined'
  172. && PerformanceObserver.supportedEntryTypes.indexOf('longtask') > -1;
  173. }
  174. /**
  175. * Checks if the current browser supports audio level stats on the receivers.
  176. */
  177. supportsReceiverStats() {
  178. return typeof window.RTCRtpReceiver !== 'undefined'
  179. && Object.keys(RTCRtpReceiver.prototype).indexOf('getSynchronizationSources') > -1;
  180. }
  181. /**
  182. * Checks if the current browser reports round trip time statistics for
  183. * the ICE candidate pair.
  184. * @return {boolean}
  185. */
  186. supportsRTTStatistics() {
  187. // Firefox does not seem to report RTT for ICE candidate pair:
  188. // eslint-disable-next-line max-len
  189. // https://www.w3.org/TR/webrtc-stats/#dom-rtcicecandidatepairstats-currentroundtriptime
  190. // It does report mozRTT for RTP streams, but at the time of this
  191. // writing it's value does not make sense most of the time
  192. // (is reported as 1):
  193. // https://bugzilla.mozilla.org/show_bug.cgi?id=1241066
  194. // For Chrome and others we rely on 'googRtt'.
  195. return !this.isFirefox();
  196. }
  197. /**
  198. * Returns true if VP9 is supported by the client on the browser. VP9 is currently disabled on Firefox and Safari
  199. * because of issues with rendering. Please check https://bugzilla.mozilla.org/show_bug.cgi?id=1492500,
  200. * https://bugs.webkit.org/show_bug.cgi?id=231071 and https://bugs.webkit.org/show_bug.cgi?id=231074 for details.
  201. */
  202. supportsVP9() {
  203. return this.isChromiumBased() || this.isReactNative();
  204. }
  205. /**
  206. * Checks if the browser uses SDP munging for turning on simulcast.
  207. *
  208. * @returns {boolean}
  209. */
  210. usesSdpMungingForSimulcast() {
  211. return this.isChromiumBased() || this.isReactNative() || this.isWebKitBased();
  212. }
  213. /**
  214. * Checks if the browser uses RIDs/MIDs for siganling the simulcast streams
  215. * to the bridge instead of the ssrcs.
  216. */
  217. usesRidsForSimulcast() {
  218. return false;
  219. }
  220. /**
  221. * Checks if the browser supports getDisplayMedia.
  222. * @returns {boolean} {@code true} if the browser supports getDisplayMedia.
  223. */
  224. supportsGetDisplayMedia() {
  225. return typeof navigator.getDisplayMedia !== 'undefined'
  226. || (typeof navigator.mediaDevices !== 'undefined'
  227. && typeof navigator.mediaDevices.getDisplayMedia
  228. !== 'undefined');
  229. }
  230. /**
  231. * Checks if the browser supports WebRTC Encoded Transform, an alternative
  232. * to insertable streams.
  233. *
  234. * NOTE: At the time of this writing the only browser supporting this is
  235. * Safari / WebKit, behind a flag.
  236. *
  237. * @returns {boolean} {@code true} if the browser supports it.
  238. */
  239. supportsEncodedTransform() {
  240. return Boolean(window.RTCRtpScriptTransform);
  241. }
  242. /**
  243. * Checks if the browser supports insertable streams, needed for E2EE.
  244. * @returns {boolean} {@code true} if the browser supports insertable streams.
  245. */
  246. supportsInsertableStreams() {
  247. if (!(typeof window.RTCRtpSender !== 'undefined'
  248. && window.RTCRtpSender.prototype.createEncodedStreams)) {
  249. return false;
  250. }
  251. // Feature-detect transferable streams which we need to operate in a worker.
  252. // See https://groups.google.com/a/chromium.org/g/blink-dev/c/1LStSgBt6AM/m/hj0odB8pCAAJ
  253. const stream = new ReadableStream();
  254. try {
  255. window.postMessage(stream, '*', [ stream ]);
  256. return true;
  257. } catch {
  258. return false;
  259. }
  260. }
  261. /**
  262. * Whether the browser supports the RED format for audio.
  263. */
  264. supportsAudioRed() {
  265. return Boolean(window.RTCRtpSender
  266. && window.RTCRtpSender.getCapabilities
  267. && window.RTCRtpSender.getCapabilities('audio').codecs.some(codec => codec.mimeType === 'audio/red')
  268. && window.RTCRtpReceiver
  269. && window.RTCRtpReceiver.getCapabilities
  270. && window.RTCRtpReceiver.getCapabilities('audio').codecs.some(codec => codec.mimeType === 'audio/red'));
  271. }
  272. /**
  273. * Checks if the browser supports unified plan.
  274. *
  275. * @returns {boolean}
  276. */
  277. supportsUnifiedPlan() {
  278. // We do not want to enable unified plan on Electron clients that have Chromium version < 96 because of
  279. // performance and screensharing issues.
  280. return !(this.isElectron() && (this._getChromiumBasedVersion() < 96));
  281. }
  282. /**
  283. * Checks if the browser supports voice activity detection via the @type {VADAudioAnalyser} service.
  284. *
  285. * @returns {boolean}
  286. */
  287. supportsVADDetection() {
  288. return this.isChromiumBased();
  289. }
  290. /**
  291. * Check if the browser supports the RTP RTX feature (and it is usable).
  292. *
  293. * @returns {boolean}
  294. */
  295. supportsRTX() {
  296. // Disable RTX on Firefox up to 96 because we prefer simulcast over RTX
  297. // see https://bugzilla.mozilla.org/show_bug.cgi?id=1738504
  298. return !(this.isFirefox() && this.isVersionLessThan('96'));
  299. }
  300. /**
  301. * Returns the version of a Chromium based browser.
  302. *
  303. * @returns {Number}
  304. */
  305. _getChromiumBasedVersion() {
  306. if (this.isChromiumBased()) {
  307. // NW.JS doesn't expose the Chrome version in the UA string.
  308. if (this.isNWJS()) {
  309. // eslint-disable-next-line no-undef
  310. return Number.parseInt(process.versions.chromium, 10);
  311. }
  312. // Here we process all browsers which use the Chrome engine but
  313. // don't necessarily identify as Chrome. We cannot use the version
  314. // comparing functions because the Electron, Opera and NW.JS
  315. // versions are inconsequential here, as we need to know the actual
  316. // Chrome engine version.
  317. const ua = navigator.userAgent;
  318. if (ua.match(/Chrome/)) {
  319. const version
  320. = Number.parseInt(ua.match(/Chrome\/([\d.]+)/)[1], 10);
  321. return version;
  322. }
  323. }
  324. return -1;
  325. }
  326. /**
  327. * Returns the version of a Safari browser.
  328. *
  329. * @returns {Number}
  330. */
  331. _getSafariVersion() {
  332. if (this.isSafari()) {
  333. return Number.parseInt(this.getVersion(), 10);
  334. }
  335. return -1;
  336. }
  337. /**
  338. * Returns the version of an ios browser.
  339. *
  340. * @returns {Number}
  341. */
  342. _getIOSVersion() {
  343. if (this.isWebKitBased()) {
  344. return Number.parseInt(this.getVersion(), 10);
  345. }
  346. return -1;
  347. }
  348. }