Navigator.share()

Secure context
This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The navigator.share() method of the Web Share API invokes the native sharing mechanism of the device.

Syntax

var sharePromise = navigator.share(data);

Parameters

data
An object containing data to share. At least one of the following fields must be specified. Available options are:
  • url: A USVString representing a URL to be shared.
  • text: A USVString representing text to be shared.
  • title: A USVString representing the title to be shared.
  • files: A " FrozenArray" representing the array of file to be shared.

Return value

A Promise that will be fulfilled once a user has completed a share action (usually the user has chosen an application to share to). It will reject immediately if the data parameter is not correctly specified, and will also reject if the user cancels sharing.

Examples

In our Web share test (see the source code) there is a button which, when clicked, invokes the Web Share API to share MDN's URL. The JavaScript looks like this:

const shareData = {
  title: 'MDN',
  text: 'Learn web development on MDN!',
  url: 'https://developer.mozilla.org',
}

const btn = document.querySelector('button');
const resultPara = document.querySelector('.result');

// Must be triggered some kind of "user activation"
btn.addEventListener('click', async () => {
  try {
    await navigator.share(shareData)
    resultPara.textContent = 'MDN shared successfully'
  } catch(err) {
    resultPara.textContent = 'Error: ' + err
  }
});

Sharing Files

To share files, first test for and call navigator.canShare(). Then include an array of files in the call to navigator.share(): 

Notice: That the sample handles feature detection by testing for navigator.canShare() rather than for navigator.share(). The data object passed to canShare() only supports the files property. Image, video, audio, and text files can be shared. 

if (navigator.canShare && navigator.canShare({ files: filesArray })) {
  navigator.share({
    files: filesArray,
    title: 'Pictures',
    text: 'Our Pictures.',
  })
  .then(() => console.log('Share was successful.'))
  .catch((error) => console.log('Sharing failed', error));
} else {
  console.log(`Your system doesn't support sharing files.`);
}

Specifications

Specification Status Comment
Web Share API
The definition of 'share()' in that specification.
Draft

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
share
Experimental
Chrome No support NoEdge No support NoFirefox No support NoIE No support NoOpera No support NoSafari Full support 12.1WebView Android No support NoChrome Android Full support 61Firefox Android No support NoOpera Android Full support 48Safari iOS Full support 12.2Samsung Internet Android Full support 8.0

Legend

Full support  
Full support
No support  
No support
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.

See Also