You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

ScreenObtainer.js 23KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711
  1. /* global chrome, $, alert */
  2. import JitsiTrackError from '../../JitsiTrackError';
  3. import * as JitsiTrackErrors from '../../JitsiTrackErrors';
  4. import browser from '../browser';
  5. const logger = require('jitsi-meet-logger').getLogger(__filename);
  6. const GlobalOnErrorHandler = require('../util/GlobalOnErrorHandler');
  7. /**
  8. * Indicates whether the Chrome desktop sharing extension is installed.
  9. * @type {boolean}
  10. */
  11. let chromeExtInstalled = false;
  12. /**
  13. * Indicates whether an update of the Chrome desktop sharing extension is
  14. * required.
  15. * @type {boolean}
  16. */
  17. let chromeExtUpdateRequired = false;
  18. let gumFunction = null;
  19. /**
  20. * The error returned by chrome when trying to start inline installation from
  21. * popup.
  22. */
  23. const CHROME_EXTENSION_POPUP_ERROR
  24. = 'Inline installs can not be initiated from pop-up windows.';
  25. /**
  26. * The error returned by chrome when trying to start inline installation from
  27. * iframe.
  28. */
  29. const CHROME_EXTENSION_IFRAME_ERROR
  30. = 'Chrome Web Store installations can only be started by the top frame.';
  31. /**
  32. * The error returned by chrome when trying to start inline installation
  33. * not from the "main" whitelisted site.
  34. * @type {string}
  35. */
  36. const CHROME_EXTENSION_INLINE_ERROR
  37. = 'Installs can only be initiated by one of'
  38. + ' the Chrome Web Store item\'s verified sites.';
  39. /**
  40. * The error returned by chrome when trying to start inline installation
  41. * with extension that doesn't support inline installation.
  42. *
  43. * @type {string}
  44. */
  45. const CHROME_EXTENSION_INLINE_NOT_SUPPORTED_ERROR
  46. = 'Inline installation is not supported for this item. '
  47. + 'The user will be redirected to the Chrome Web Store.';
  48. /**
  49. * The error message returned by chrome when the extension is installed.
  50. */
  51. const CHROME_NO_EXTENSION_ERROR_MSG // eslint-disable-line no-unused-vars
  52. = 'Could not establish connection. Receiving end does not exist.';
  53. /**
  54. * The error message returned by chrome when the extension install action needs
  55. * to be initiated by a user gesture.
  56. * @type {string}
  57. */
  58. const CHROME_USER_GESTURE_REQ_ERROR
  59. = 'Chrome Web Store installations can only be initated by a user gesture.';
  60. /**
  61. * The error message returned by chrome when the extension install has been
  62. * cancelled by the user.
  63. * @type {string}
  64. */
  65. const CHROME_USER_CANCEL_EXTENSION_INSTALL = 'User cancelled install';
  66. /**
  67. * Handles obtaining a stream from a screen capture on different browsers.
  68. */
  69. const ScreenObtainer = {
  70. /**
  71. * If not <tt>null</tt> it means that the initialization process is still in
  72. * progress. It is used to make desktop stream request wait and continue
  73. * after it's done.
  74. * {@type Promise|null}
  75. */
  76. intChromeExtPromise: null,
  77. obtainStream: null,
  78. /**
  79. * Initializes the function used to obtain a screen capture
  80. * (this.obtainStream).
  81. *
  82. * @param {object} options
  83. * @param {boolean} [options.desktopSharingChromeDisabled]
  84. * @param {boolean} [options.desktopSharingChromeExtId]
  85. * @param {boolean} [options.desktopSharingFirefoxDisabled]
  86. * @param {Function} gum GUM method
  87. */
  88. init(options = {
  89. desktopSharingChromeDisabled: false,
  90. desktopSharingChromeExtId: null,
  91. desktopSharingFirefoxDisabled: false
  92. }, gum) {
  93. this.options = options;
  94. gumFunction = gum;
  95. this.obtainStream = this._createObtainStreamMethod(options);
  96. if (!this.obtainStream) {
  97. logger.info('Desktop sharing disabled');
  98. }
  99. },
  100. /**
  101. * Returns a method which will be used to obtain the screen sharing stream
  102. * (based on the browser type).
  103. *
  104. * @param {object} options passed from {@link init} - check description
  105. * there
  106. * @returns {Function}
  107. * @private
  108. */
  109. _createObtainStreamMethod(options) {
  110. if (browser.isNWJS()) {
  111. return (_, onSuccess, onFailure) => {
  112. window.JitsiMeetNW.obtainDesktopStream(
  113. onSuccess,
  114. (error, constraints) => {
  115. let jitsiError;
  116. // FIXME:
  117. // This is very very dirty fix for recognising that the
  118. // user have clicked the cancel button from the Desktop
  119. // sharing pick window. The proper solution would be to
  120. // detect this in the NWJS application by checking the
  121. // streamId === "". Even better solution would be to
  122. // stop calling GUM from the NWJS app and just pass the
  123. // streamId to lib-jitsi-meet. This way the desktop
  124. // sharing implementation for NWJS and chrome extension
  125. // will be the same and lib-jitsi-meet will be able to
  126. // control the constraints, check the streamId, etc.
  127. //
  128. // I cannot find documentation about "InvalidStateError"
  129. // but this is what we are receiving from GUM when the
  130. // streamId for the desktop sharing is "".
  131. if (error && error.name === 'InvalidStateError') {
  132. jitsiError = new JitsiTrackError(
  133. JitsiTrackErrors.CHROME_EXTENSION_USER_CANCELED
  134. );
  135. } else {
  136. jitsiError = new JitsiTrackError(
  137. error, constraints, [ 'desktop' ]);
  138. }
  139. (typeof onFailure === 'function')
  140. && onFailure(jitsiError);
  141. });
  142. };
  143. } else if (browser.isElectron()) {
  144. return this.obtainScreenOnElectron;
  145. } else if (browser.isChrome() || browser.isOpera()) {
  146. if (browser.isVersionLessThan('34')) {
  147. logger.info('Chrome extension not supported until ver 34');
  148. return null;
  149. } else if (options.desktopSharingChromeDisabled
  150. || options.desktopSharingChromeMethod === false
  151. || !options.desktopSharingChromeExtId) {
  152. // TODO: desktopSharingChromeMethod is deprecated, remove.
  153. return null;
  154. }
  155. logger.info('Using Chrome extension for desktop sharing');
  156. this.intChromeExtPromise
  157. = initChromeExtension(options).then(() => {
  158. this.intChromeExtPromise = null;
  159. });
  160. return this.obtainScreenFromExtension;
  161. } else if (browser.isFirefox()) {
  162. if (options.desktopSharingFirefoxDisabled) {
  163. return null;
  164. } else if (window.location.protocol === 'http:') {
  165. logger.log('Screen sharing is not supported over HTTP. '
  166. + 'Use of HTTPS is required.');
  167. return null;
  168. }
  169. return this.obtainScreenOnFirefox;
  170. } else if (browser.isEdge() && navigator.getDisplayMedia) {
  171. return (_, onSuccess, onFailure) => {
  172. navigator.getDisplayMedia({ video: true })
  173. .then(stream => onSuccess({
  174. stream,
  175. sourceId: stream.id
  176. }))
  177. .catch(onFailure);
  178. };
  179. }
  180. logger.log(
  181. 'Screen sharing not supported by the current browser: ',
  182. browser.getName());
  183. return null;
  184. },
  185. /**
  186. * Checks whether obtaining a screen capture is supported in the current
  187. * environment.
  188. * @returns {boolean}
  189. */
  190. isSupported() {
  191. return this.obtainStream !== null;
  192. },
  193. /**
  194. * Obtains a screen capture stream on Firefox.
  195. * @param callback
  196. * @param errorCallback
  197. */
  198. obtainScreenOnFirefox(options, callback, errorCallback) {
  199. obtainWebRTCScreen(options.gumOptions, callback, errorCallback);
  200. },
  201. /**
  202. * Obtains a screen capture stream on Electron.
  203. *
  204. * @param {Object} [options] - Screen sharing options.
  205. * @param {Array<string>} [options.desktopSharingSources] - Array with the
  206. * sources that have to be displayed in the desktop picker window ('screen',
  207. * 'window', etc.).
  208. * @param onSuccess - Success callback.
  209. * @param onFailure - Failure callback.
  210. */
  211. obtainScreenOnElectron(options = {}, onSuccess, onFailure) {
  212. if (window.JitsiMeetScreenObtainer
  213. && window.JitsiMeetScreenObtainer.openDesktopPicker) {
  214. const { desktopSharingSources, gumOptions } = options;
  215. window.JitsiMeetScreenObtainer.openDesktopPicker(
  216. {
  217. desktopSharingSources: desktopSharingSources
  218. || this.options.desktopSharingChromeSources
  219. },
  220. (streamId, streamType) =>
  221. onGetStreamResponse(
  222. {
  223. response: {
  224. streamId,
  225. streamType
  226. },
  227. gumOptions
  228. },
  229. onSuccess,
  230. onFailure
  231. ),
  232. err => onFailure(new JitsiTrackError(
  233. JitsiTrackErrors.ELECTRON_DESKTOP_PICKER_ERROR,
  234. err
  235. ))
  236. );
  237. } else {
  238. onFailure(new JitsiTrackError(
  239. JitsiTrackErrors.ELECTRON_DESKTOP_PICKER_NOT_FOUND));
  240. }
  241. },
  242. /**
  243. * Asks Chrome extension to call chooseDesktopMedia and gets chrome
  244. * 'desktop' stream for returned stream token.
  245. */
  246. obtainScreenFromExtension(options, streamCallback, failCallback) {
  247. if (this.intChromeExtPromise !== null) {
  248. this.intChromeExtPromise.then(() => {
  249. this.obtainScreenFromExtension(
  250. options, streamCallback, failCallback);
  251. });
  252. return;
  253. }
  254. const {
  255. desktopSharingChromeExtId,
  256. desktopSharingChromeSources
  257. } = this.options;
  258. const {
  259. gumOptions
  260. } = options;
  261. const doGetStreamFromExtensionOptions = {
  262. desktopSharingChromeExtId,
  263. desktopSharingChromeSources:
  264. options.desktopSharingSources || desktopSharingChromeSources,
  265. gumOptions
  266. };
  267. if (chromeExtInstalled) {
  268. doGetStreamFromExtension(
  269. doGetStreamFromExtensionOptions,
  270. streamCallback,
  271. failCallback);
  272. } else {
  273. if (chromeExtUpdateRequired) {
  274. /* eslint-disable no-alert */
  275. alert(
  276. 'Jitsi Desktop Streamer requires update. '
  277. + 'Changes will take effect after next Chrome restart.');
  278. /* eslint-enable no-alert */
  279. }
  280. // for opera there is no inline install
  281. // extension "Download Chrome Extension" allows us to open
  282. // the chrome webstore and install from there and then activate our
  283. // extension
  284. if (browser.isOpera()) {
  285. this.handleExternalInstall(options, streamCallback,
  286. failCallback);
  287. return;
  288. }
  289. try {
  290. chrome.webstore.install(
  291. getWebStoreInstallUrl(this.options),
  292. arg => {
  293. logger.log('Extension installed successfully', arg);
  294. chromeExtInstalled = true;
  295. // We need to give a moment to the endpoint to become
  296. // available.
  297. waitForExtensionAfterInstall(this.options, 200, 10)
  298. .then(() => {
  299. doGetStreamFromExtension(
  300. doGetStreamFromExtensionOptions,
  301. streamCallback,
  302. failCallback);
  303. })
  304. .catch(() => {
  305. this.handleExtensionInstallationError(options,
  306. streamCallback, failCallback);
  307. });
  308. },
  309. this.handleExtensionInstallationError.bind(this,
  310. options, streamCallback, failCallback)
  311. );
  312. } catch (e) {
  313. this.handleExtensionInstallationError(options, streamCallback,
  314. failCallback, e);
  315. }
  316. }
  317. },
  318. /* eslint-disable max-params */
  319. handleExternalInstall(options, streamCallback, failCallback, e) {
  320. const webStoreInstallUrl = getWebStoreInstallUrl(this.options);
  321. options.listener('waitingForExtension', webStoreInstallUrl);
  322. this.checkForChromeExtensionOnInterval(options, streamCallback,
  323. failCallback, e);
  324. },
  325. handleExtensionInstallationError(options, streamCallback, failCallback, e) {
  326. const webStoreInstallUrl = getWebStoreInstallUrl(this.options);
  327. if ((CHROME_EXTENSION_POPUP_ERROR === e
  328. || CHROME_EXTENSION_IFRAME_ERROR === e
  329. || CHROME_EXTENSION_INLINE_ERROR === e
  330. || CHROME_EXTENSION_INLINE_NOT_SUPPORTED_ERROR === e)
  331. && options.interval > 0
  332. && typeof options.checkAgain === 'function'
  333. && typeof options.listener === 'function') {
  334. this.handleExternalInstall(options, streamCallback,
  335. failCallback, e);
  336. return;
  337. }
  338. const msg
  339. = `Failed to install the extension from ${webStoreInstallUrl}`;
  340. logger.log(msg, e);
  341. let error;
  342. if (e === CHROME_USER_CANCEL_EXTENSION_INSTALL) {
  343. error = JitsiTrackErrors.CHROME_EXTENSION_USER_CANCELED;
  344. } else if (e === CHROME_USER_GESTURE_REQ_ERROR) {
  345. error = JitsiTrackErrors.CHROME_EXTENSION_USER_GESTURE_REQUIRED;
  346. } else {
  347. error = JitsiTrackErrors.CHROME_EXTENSION_INSTALLATION_ERROR;
  348. }
  349. failCallback(new JitsiTrackError(error, msg));
  350. },
  351. /* eslint-enable max-params */
  352. checkForChromeExtensionOnInterval(options, streamCallback, failCallback) {
  353. if (options.checkAgain() === false) {
  354. failCallback(new JitsiTrackError(
  355. JitsiTrackErrors.CHROME_EXTENSION_INSTALLATION_ERROR));
  356. return;
  357. }
  358. waitForExtensionAfterInstall(this.options, options.interval, 1)
  359. .then(() => {
  360. chromeExtInstalled = true;
  361. options.listener('extensionFound');
  362. this.obtainScreenFromExtension(options,
  363. streamCallback, failCallback);
  364. })
  365. .catch(() => {
  366. this.checkForChromeExtensionOnInterval(options,
  367. streamCallback, failCallback);
  368. });
  369. }
  370. };
  371. /**
  372. * Obtains a desktop stream using getUserMedia.
  373. * For this to work on Chrome, the
  374. * 'chrome://flags/#enable-usermedia-screen-capture' flag must be enabled.
  375. *
  376. * On firefox, the document's domain must be white-listed in the
  377. * 'media.getusermedia.screensharing.allowed_domains' preference in
  378. * 'about:config'.
  379. */
  380. function obtainWebRTCScreen(options, streamCallback, failCallback) {
  381. gumFunction(
  382. [ 'screen' ],
  383. stream => streamCallback({ stream }),
  384. failCallback,
  385. options
  386. );
  387. }
  388. /**
  389. * Constructs inline install URL for Chrome desktop streaming extension.
  390. * The 'chromeExtensionId' must be defined in options parameter.
  391. * @param options supports "desktopSharingChromeExtId"
  392. * @returns {string}
  393. */
  394. function getWebStoreInstallUrl(options) {
  395. return (
  396. `https://chrome.google.com/webstore/detail/${
  397. options.desktopSharingChromeExtId}`);
  398. }
  399. /**
  400. * Checks whether an update of the Chrome extension is required.
  401. * @param minVersion minimal required version
  402. * @param extVersion current extension version
  403. * @returns {boolean}
  404. */
  405. function isUpdateRequired(minVersion, extVersion) {
  406. try {
  407. const s1 = minVersion.split('.');
  408. const s2 = extVersion.split('.');
  409. const len = Math.max(s1.length, s2.length);
  410. for (let i = 0; i < len; i++) {
  411. let n1 = 0,
  412. n2 = 0;
  413. if (i < s1.length) {
  414. n1 = parseInt(s1[i], 10);
  415. }
  416. if (i < s2.length) {
  417. n2 = parseInt(s2[i], 10);
  418. }
  419. if (isNaN(n1) || isNaN(n2)) {
  420. return true;
  421. } else if (n1 !== n2) {
  422. return n1 > n2;
  423. }
  424. }
  425. // will happen if both versions have identical numbers in
  426. // their components (even if one of them is longer, has more components)
  427. return false;
  428. } catch (e) {
  429. GlobalOnErrorHandler.callErrorHandler(e);
  430. logger.error('Failed to parse extension version', e);
  431. return true;
  432. }
  433. }
  434. /**
  435. *
  436. * @param callback
  437. * @param options
  438. */
  439. function checkChromeExtInstalled(callback, options) {
  440. if (typeof chrome === 'undefined' || !chrome || !chrome.runtime) {
  441. // No API, so no extension for sure
  442. callback(false, false);
  443. return;
  444. }
  445. chrome.runtime.sendMessage(
  446. options.desktopSharingChromeExtId,
  447. { getVersion: true },
  448. response => {
  449. if (!response || !response.version) {
  450. // Communication failure - assume that no endpoint exists
  451. logger.warn(
  452. 'Extension not installed?: ', chrome.runtime.lastError);
  453. callback(false, false);
  454. return;
  455. }
  456. // Check installed extension version
  457. const extVersion = response.version;
  458. logger.log(`Extension version is: ${extVersion}`);
  459. const updateRequired
  460. = isUpdateRequired(
  461. options.desktopSharingChromeMinExtVersion,
  462. extVersion);
  463. callback(!updateRequired, updateRequired);
  464. }
  465. );
  466. }
  467. /**
  468. *
  469. * @param options
  470. * @param streamCallback
  471. * @param failCallback
  472. */
  473. function doGetStreamFromExtension(options, streamCallback, failCallback) {
  474. const {
  475. desktopSharingChromeSources,
  476. desktopSharingChromeExtId,
  477. gumOptions
  478. } = options;
  479. // Sends 'getStream' msg to the extension.
  480. // Extension id must be defined in the config.
  481. chrome.runtime.sendMessage(
  482. desktopSharingChromeExtId,
  483. {
  484. getStream: true,
  485. sources: desktopSharingChromeSources
  486. },
  487. response => {
  488. if (!response) {
  489. // possibly re-wraping error message to make code consistent
  490. const lastError = chrome.runtime.lastError;
  491. failCallback(lastError instanceof Error
  492. ? lastError
  493. : new JitsiTrackError(
  494. JitsiTrackErrors.CHROME_EXTENSION_GENERIC_ERROR,
  495. lastError));
  496. return;
  497. }
  498. logger.log('Response from extension: ', response);
  499. onGetStreamResponse(
  500. {
  501. response,
  502. gumOptions
  503. },
  504. streamCallback,
  505. failCallback
  506. );
  507. }
  508. );
  509. }
  510. /**
  511. * Initializes <link rel=chrome-webstore-item /> with extension id set in
  512. * config.js to support inline installs. Host site must be selected as main
  513. * website of published extension.
  514. * @param options supports "desktopSharingChromeExtId"
  515. */
  516. function initInlineInstalls(options) {
  517. if ($('link[rel=chrome-webstore-item]').length === 0) {
  518. $('head').append('<link rel="chrome-webstore-item">');
  519. }
  520. $('link[rel=chrome-webstore-item]').attr('href',
  521. getWebStoreInstallUrl(options));
  522. }
  523. /**
  524. *
  525. * @param options
  526. *
  527. * @return {Promise} - a Promise resolved once the initialization process is
  528. * finished.
  529. */
  530. function initChromeExtension(options) {
  531. // Initialize Chrome extension inline installs
  532. initInlineInstalls(options);
  533. return new Promise(resolve => {
  534. // Check if extension is installed
  535. checkChromeExtInstalled((installed, updateRequired) => {
  536. chromeExtInstalled = installed;
  537. chromeExtUpdateRequired = updateRequired;
  538. logger.info(
  539. `Chrome extension installed: ${
  540. chromeExtInstalled} updateRequired: ${
  541. chromeExtUpdateRequired}`);
  542. resolve();
  543. }, options);
  544. });
  545. }
  546. /**
  547. * Checks "retries" times on every "waitInterval"ms whether the ext is alive.
  548. * @param {Object} options the options passed to ScreanObtainer.obtainStream
  549. * @param {int} waitInterval the number of ms between retries
  550. * @param {int} retries the number of retries
  551. * @returns {Promise} returns promise that will be resolved when the extension
  552. * is alive and rejected if the extension is not alive even after "retries"
  553. * checks
  554. */
  555. function waitForExtensionAfterInstall(options, waitInterval, retries) {
  556. if (retries === 0) {
  557. return Promise.reject();
  558. }
  559. return new Promise((resolve, reject) => {
  560. let currentRetries = retries;
  561. const interval = window.setInterval(() => {
  562. checkChromeExtInstalled(installed => {
  563. if (installed) {
  564. window.clearInterval(interval);
  565. resolve();
  566. } else {
  567. currentRetries--;
  568. if (currentRetries === 0) {
  569. reject();
  570. window.clearInterval(interval);
  571. }
  572. }
  573. }, options);
  574. }, waitInterval);
  575. });
  576. }
  577. /**
  578. * Handles response from external application / extension and calls GUM to
  579. * receive the desktop streams or reports error.
  580. * @param {object} options
  581. * @param {object} options.response
  582. * @param {string} options.response.streamId - the streamId for the desktop
  583. * stream.
  584. * @param {string} options.response.error - error to be reported.
  585. * @param {object} options.gumOptions - options passed to GUM.
  586. * @param {Function} onSuccess - callback for success.
  587. * @param {Function} onFailure - callback for failure.
  588. * @param {object} gumOptions - options passed to GUM.
  589. */
  590. function onGetStreamResponse(
  591. options = {
  592. response: {},
  593. gumOptions: {}
  594. },
  595. onSuccess,
  596. onFailure) {
  597. const { streamId, streamType, error } = options.response || {};
  598. if (streamId) {
  599. gumFunction(
  600. [ 'desktop' ],
  601. stream => onSuccess({
  602. stream,
  603. sourceId: streamId,
  604. sourceType: streamType
  605. }),
  606. onFailure,
  607. {
  608. desktopStream: streamId,
  609. ...options.gumOptions
  610. });
  611. } else {
  612. // As noted in Chrome Desktop Capture API:
  613. // If user didn't select any source (i.e. canceled the prompt)
  614. // then the callback is called with an empty streamId.
  615. if (streamId === '') {
  616. onFailure(new JitsiTrackError(
  617. JitsiTrackErrors.CHROME_EXTENSION_USER_CANCELED));
  618. return;
  619. }
  620. onFailure(new JitsiTrackError(
  621. JitsiTrackErrors.CHROME_EXTENSION_GENERIC_ERROR,
  622. error));
  623. }
  624. }
  625. export default ScreenObtainer;