TypeScript

Using The Web Sharing API

How to use the new Web Share API

TL;DR

navigator.share() is supported in some the mobile browsers

How to use Share API

TypeScript 3.9+ support the share API in the dom typing so you will get a good autocompletion.

First of all make sure your browser supports share API by checking navigator.share != null (I usually prefer checking == with null to cover null and undefined but most people will check if navigator.share is truthy value).

Then:

async function shareContent(shareDate: { title: string; text: string; url: string }) {
  if (navigator.share)
    try {
      await navigator.share(shareDate);
    } catch (err) {}
}

Note that you will get an error if the user cancels the sharing.

Browser Support

Firefox mobile is missing, but it’s safe to use if you check navigator.share.

Check yourself in Can I use

Browser support for WEB Share API

Subscribe to Nir Tamir

Get the latest posts delivered right to your inbox