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

BrowserCapabilities.js 9.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328
  1. import { getLogger } from 'jitsi-meet-logger';
  2. import { BrowserDetection } from 'js-utils';
  3. const logger = getLogger(__filename);
  4. // TODO: Move this code to js-utils.
  5. // NOTE: Now we are extending BrowserDetection in order to preserve
  6. // RTCBrowserType interface but maybe it worth exporting BrowserCapabilities
  7. // and BrowserDetection as separate objects in future.
  8. /**
  9. * Implements browser capabilities for lib-jitsi-meet.
  10. */
  11. export default class BrowserCapabilities extends BrowserDetection {
  12. /**
  13. * Creates new BrowserCapabilities instance.
  14. */
  15. constructor() {
  16. super();
  17. logger.info(
  18. `This appears to be ${this.getName()}, ver: ${this.getVersion()}`);
  19. }
  20. /**
  21. * Tells whether or not the <tt>MediaStream/tt> is removed from
  22. * the <tt>PeerConnection</tt> and disposed on video mute (in order to turn
  23. * off the camera device).
  24. * @return {boolean} <tt>true</tt> if the current browser supports this
  25. * strategy or <tt>false</tt> otherwise.
  26. */
  27. doesVideoMuteByStreamRemove() {
  28. return !(
  29. this.isFirefox()
  30. || this.isEdge()
  31. || this.isReactNative()
  32. || this.isSafariWithWebrtc()
  33. );
  34. }
  35. /**
  36. * Check whether or not the current browser support peer to peer connections
  37. * @return {boolean} <tt>true</tt> if p2p is supported or <tt>false</tt>
  38. * otherwise.
  39. */
  40. supportsP2P() {
  41. return !this.isEdge() && !this.isFirefox();
  42. }
  43. /**
  44. * Checks if the current browser is Chromium based, that is, it's either
  45. * Chrome / Chromium or uses it as its engine, but doesn't identify as
  46. * Chrome.
  47. *
  48. * This includes the following browsers:
  49. * - Chrome and Chromium
  50. * - Other browsers which use the Chrome engine, but are detected as Chrome,
  51. * such as Brave and Vivaldi
  52. * - Browsers which are NOT Chrome but use it as their engine, and have
  53. * custom detection code: Opera, Electron and NW.JS
  54. */
  55. isChromiumBased() {
  56. return this.isChrome()
  57. || this.isElectron()
  58. || this.isNWJS()
  59. || this.isOpera();
  60. }
  61. /**
  62. * Checks if current browser is a Safari and a version of Safari that
  63. * supports native webrtc.
  64. *
  65. * @returns {boolean}
  66. */
  67. isSafariWithWebrtc() {
  68. return this.isSafari()
  69. && !this.isVersionLessThan('11');
  70. }
  71. /**
  72. * Checks if the current browser is supported.
  73. *
  74. * @returns {boolean} true if the browser is supported, false otherwise.
  75. */
  76. isSupported() {
  77. return this.isChromiumBased()
  78. || this.isEdge()
  79. || this.isFirefox()
  80. || this.isReactNative()
  81. || this.isSafariWithWebrtc();
  82. }
  83. /**
  84. * Checks if the current browser triggers 'onmute'/'onunmute' events when
  85. * user's connection is interrupted and the video stops playback.
  86. * @returns {*|boolean} 'true' if the event is supported or 'false'
  87. * otherwise.
  88. */
  89. supportsVideoMuteOnConnInterrupted() {
  90. return this.isChromiumBased() || this.isReactNative();
  91. }
  92. /**
  93. * Checks if the current browser reports upload and download bandwidth
  94. * statistics.
  95. * @return {boolean}
  96. */
  97. supportsBandwidthStatistics() {
  98. // FIXME bandwidth stats are currently not implemented for FF on our
  99. // side, but not sure if not possible ?
  100. return !this.isFirefox() && !this.isEdge()
  101. && !this.isSafariWithWebrtc();
  102. }
  103. /**
  104. * Checks if the current browser supports WebRTC datachannels.
  105. * @return {boolean}
  106. */
  107. supportsDataChannels() {
  108. // NOTE: Edge does not yet implement DataChannel.
  109. return !this.isEdge();
  110. }
  111. /**
  112. * Checks if the current browser support the device change event.
  113. * @return {boolean}
  114. */
  115. supportsDeviceChangeEvent() {
  116. return navigator.mediaDevices
  117. && typeof navigator.mediaDevices.ondevicechange !== 'undefined'
  118. && typeof navigator.mediaDevices.addEventListener !== 'undefined';
  119. }
  120. /**
  121. * Checks if the current browser supports the MediaStream constructor as
  122. * defined by https://www.w3.org/TR/mediacapture-streams/#constructors. In
  123. * cases where there is no support, it maybe be necessary to get audio
  124. * and video in two distinct GUM calls.
  125. * @return {boolean}
  126. */
  127. supportsMediaStreamConstructor() {
  128. return !this.isReactNative();
  129. }
  130. /**
  131. * Checks if the current browser supports RTP statictics collecting.
  132. * Required by {@link RTPStatsCollector}.
  133. *
  134. * @returns {boolean} true if they are supported, false otherwise.
  135. */
  136. supportsRtpStatistics() {
  137. return this.isChromiumBased()
  138. || this.isEdge()
  139. || this.isFirefox()
  140. || this.isReactNative()
  141. || this.isSafariWithWebrtc();
  142. }
  143. /**
  144. * Checks if the current browser supports RTT statistics for srflx local
  145. * candidates through the legacy getStats() API.
  146. */
  147. supportsLocalCandidateRttStatistics() {
  148. return this.isChromiumBased() || this.isReactNative();
  149. }
  150. /**
  151. * Checks if the current browser reports round trip time statistics for
  152. * the ICE candidate pair.
  153. * @return {boolean}
  154. */
  155. supportsRTTStatistics() {
  156. // Firefox does not seem to report RTT for ICE candidate pair:
  157. // eslint-disable-next-line max-len
  158. // https://www.w3.org/TR/webrtc-stats/#dom-rtcicecandidatepairstats-currentroundtriptime
  159. // It does report mozRTT for RTP streams, but at the time of this
  160. // writing it's value does not make sense most of the time
  161. // (is reported as 1):
  162. // https://bugzilla.mozilla.org/show_bug.cgi?id=1241066
  163. // For Chrome and others we rely on 'googRtt'.
  164. return !this.isFirefox() && !this.isEdge();
  165. }
  166. /**
  167. * Checks whether the browser supports RTPSender.
  168. *
  169. * @returns {boolean}
  170. */
  171. supportsRtpSender() {
  172. return this.isFirefox();
  173. }
  174. /**
  175. * Checks whether the browser supports RTX.
  176. *
  177. * @returns {boolean}
  178. */
  179. supportsRtx() {
  180. return !this.isFirefox();
  181. }
  182. /**
  183. * Whether jitsi-meet supports simulcast on the current browser.
  184. * @returns {boolean}
  185. */
  186. supportsSimulcast() {
  187. return this.isChromiumBased()
  188. || this.isFirefox() || this.isReactNative();
  189. }
  190. /**
  191. * Returns whether or not the current browser can support capturing video,
  192. * be it camera or desktop, and displaying received video.
  193. *
  194. * @returns {boolean}
  195. */
  196. supportsVideo() {
  197. // FIXME: Check if we can use supportsVideoOut and supportsVideoIn. I
  198. // leave the old implementation here in order not to brake something.
  199. // Currently Safari using webrtc/adapter does not support video due in
  200. // part to Safari only supporting H264 and the bridge sending VP8.
  201. return !this.isSafariWithWebrtc();
  202. }
  203. /**
  204. * Checks if the browser uses plan B.
  205. *
  206. * @returns {boolean}
  207. */
  208. usesPlanB() {
  209. return !this.usesUnifiedPlan();
  210. }
  211. /**
  212. * Checks if the browser uses unified plan.
  213. *
  214. * @returns {boolean}
  215. */
  216. usesUnifiedPlan() {
  217. return this.isFirefox();
  218. }
  219. /**
  220. * Returns whether or not the current browser should be using the new
  221. * getUserMedia flow, which utilizes the adapter shim. This method should
  222. * be temporary and used while migrating all browsers to use adapter and
  223. * the new getUserMedia.
  224. *
  225. * @returns {boolean}
  226. */
  227. usesNewGumFlow() {
  228. const REQUIRED_CHROME_VERSION = 61;
  229. if (this.isChrome()) {
  230. return !this.isVersionLessThan(REQUIRED_CHROME_VERSION);
  231. }
  232. if (this.isFirefox() || this.isSafariWithWebrtc()) {
  233. return true;
  234. }
  235. if (this.isChromiumBased()) {
  236. return this._getChromiumBasedVersion() >= REQUIRED_CHROME_VERSION;
  237. }
  238. return false;
  239. }
  240. /**
  241. * Checks if the browser uses webrtc-adapter. All browsers using the new
  242. * getUserMedia flow and Edge.
  243. *
  244. * @returns {boolean}
  245. */
  246. usesAdapter() {
  247. return this.usesNewGumFlow() || this.isEdge();
  248. }
  249. /**
  250. * Checks if the browser supposrts getDisplayMedia.
  251. * @returns {boolean} {@code true} if the browser supposrts getDisplayMedia.
  252. */
  253. supportsGetDisplayMedia() {
  254. return navigator.getDisplayMedia !== undefined;
  255. }
  256. /**
  257. * Checks if the browser supports the "sdpSemantics" configuration option.
  258. * https://webrtc.org/web-apis/chrome/unified-plan/
  259. *
  260. * @returns {boolean}
  261. */
  262. supportsSdpSemantics() {
  263. return this.isChromiumBased() && this._getChromiumBasedVersion() >= 65;
  264. }
  265. /**
  266. * Returns the version of a Chromium based browser.
  267. *
  268. * @returns {Number}
  269. */
  270. _getChromiumBasedVersion() {
  271. if (this.isChromiumBased()) {
  272. // NW.JS doesn't expose the Chrome version in the UA string.
  273. if (this.isNWJS()) {
  274. // eslint-disable-next-line no-undef
  275. return Number.parseInt(process.versions.chromium, 10);
  276. }
  277. // Here we process all browsers which use the Chrome engine but
  278. // don't necessarily identify as Chrome. We cannot use the version
  279. // comparing functions because the Electron, Opera and NW.JS
  280. // versions are inconsequential here, as we need to know the actual
  281. // Chrome engine version.
  282. const ua = navigator.userAgent;
  283. if (ua.match(/Chrome/)) {
  284. const version
  285. = Number.parseInt(ua.match(/Chrome\/([\d.]+)/)[1], 10);
  286. return version;
  287. }
  288. }
  289. return -1;
  290. }
  291. }