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

ScreenObtainer.js 22KB

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