選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

BrowserCapabilities.js 13KB

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