No Login Data Private Local Save

Web Share API Tester - Online Demo & Code

14
0
0
0

Web Share API Tester

Test the Web Share API on your browser, see what sharing features are supported, and try it live with your own content.

Browser Support Detection
  • navigator.share
  • navigator.canShare
  • File Sharing
  • Secure Context
Try It Yourself
Code Examples
if (navigator.share) {
  try {
    await navigator.share({
      title: 'My Title',
      text: 'Check out this page!',
      url: 'https://example.com',
    });
    console.log('Shared successfully');
  } catch (err) {
    console.log('Share failed: ', err);
  }
}
if (navigator.share && navigator.canShare) {
  const file = new File(['hello'], 'hello.txt', { type: 'text/plain' });
  if (navigator.canShare({ files: [file] })) {
    try {
      await navigator.share({
        files: [file],
        title: 'My File',
      });
    } catch (err) {
      console.error(err);
    }
  }
}
// Check if a specific data set can be shared
if (navigator.canShare && navigator.canShare({ files: [file] })) {
  // Can share this file
}
Frequently Asked Questions

The Web Share API allows websites to invoke the native sharing capabilities of a device. Instead of building custom share buttons, you can use the system’s share dialog to share text, URLs, or files to other apps installed on the user’s device.

  • A secure context (HTTPS or localhost) is required.
  • The share action must be triggered by a user gesture (e.g., a click or tap).
  • The browser must implement the navigator.share method.

Yes, in browsers that support the file sharing extension you can pass an array of File objects in the files property. Use navigator.canShare({files: [...]}) to check if a particular file or set of files can be shared.

Common reasons:
  • The page is not served over HTTPS (or localhost).
  • The browser does not support the Web Share API (check the support detection above).
  • No user gesture – sharing must be initiated by a click or touch event.
  • The share dialog was canceled by the user (this triggers an AbortError).

Desktop Chrome and Edge support it on Windows, macOS, and Chrome OS. Safari and Firefox have limited or no support. Always check Can I Use for the latest browser compatibility.

The promise returned by navigator.share rejects with an AbortError. You should handle this case gracefully and not treat it as a real error.

No. The Web Share API is only available in secure contexts (HTTPS or localhost). If your site uses HTTP, you will need to migrate to HTTPS first.