Web Share API

Bharat Kalluri / 2020-10-13

With the web share API, web applications can utilize the system provided sharing capabilities. You can even read the spec in a couple of minutes.

Usage

  • The site must be served over HTTPS (localhost works for development)
  • Currently (as of 13 Oct 2020) the browser support is still not good. Most of the popular mobile browsers support it though.
  • The navigator.share method has to be called when the user does action (like button click). You cannot call the method directly (for example on page load).
  • It can share URLs, text or files

Let us look at an example

if (navigator.share) {
// Share API available
navigator
.share({
title: 'BharatKalluri.in',
url: 'https://bharatkalluri.in',
})
.then(() => console.log('Shared successfully'))
.catch((err) => console.log(err));
} else {
// Fallback
}

navigator.share needs at least on of the following parameters: title, text, url or files. Desktop browsers largely lack support for the API. So a fall back is necessary.

That's about it, hopefully support for this API will land on all major browsers soon.

Subscribe to the newsletter

Spotify album cover

NowReading logDashboardUses