← Lessons

quiz vs the machine

Platinum1720

Frontend

The Web Share API

Invoke the native share sheet to send content to other apps.

4 min read · advanced · beat Platinum to climb

Sharing the native way

The Web Share API lets a web app trigger the operating system share sheet, the same one native apps use, so users can send a link, text, or files to any installed app.

  • navigator share opens the share dialog and returns a promise
  • It accepts title, text, url, and optionally files
  • It must be called from a user gesture like a click
  • It requires a secure context and is mostly available on mobile

Checking support and files

Always feature detect navigator share first, and for files use navigator canShare to confirm the data is shareable before calling share. Provide a fallback such as a copy link button on unsupported browsers.

Why it matters

Instead of building custom share buttons for each network, one call hands off to whatever the user actually has installed, respecting their choices and reducing third party scripts.

Key idea

The Web Share API calls navigator share from a user gesture to open the native share sheet, with canShare for files and a copy link fallback where it is unsupported.

Check yourself

Answer to earn rating on the learn ladder.

1. What does navigator share do when invoked?

2. What two conditions are required to call navigator share?

3. How do you confirm files can be shared before calling share?