Web Share API

安全上下文：此功能仅在安全上下文（HTTPS）中可用，在某些或所有支持的浏览器中可用。

Web Share API提供了一种机制，用于将文本、链接、文件和其他内容共享到用户选择的任意共享目标。

注意：此 API不可用于Web Workers（未通过WorkerNavigator公开）。

注意：此 API 不应与Web Share Target API混淆，后者允许网站将其自身指定为共享目标。

概念和用法

Web Share API允许网站将文本、链接、文件和其他内容共享到用户选择的共享目标，利用底层操作系统的共享机制。这些共享目标通常包括系统剪贴板、电子邮件、联系人或消息应用程序以及蓝牙或 Wi-Fi 通道。

该 API 只有两种方法。 navigator.canShare()方法可用于在将数据传递给navigator.share()进行发送之前，首先验证某些数据是否“可共享”。

navigator.share()方法调用底层操作系统的本机共享机制并传递指定的数据。它需要瞬时激活，因此必须由 UI 事件（如按钮点击）触发。此外，该方法必须指定本机实现支持共享的有效数据。

Web Share API 受web-share权限策略控制。如果支持该策略但尚未授予，则这两种方法都将指示数据不可共享。

接口

对其他接口的扩展

navigator.canShare(): 返回一个布尔值，指示指定的数据是否可共享。
navigator.share(): 返回一个Promise，如果传递的数据成功发送到共享目标，则解析。此方法必须在按钮点击或其他用户激活（需要瞬时激活）时调用。

示例

以下代码显示了如何使用navigator.share()共享链接，由按钮点击触发。

const shareData = {
  title: "MDN",
  text: "Learn web development on MDN!",
  url: "https://mdn.org.cn",
};

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

// Share must be triggered by "user activation"
btn.addEventListener("click", async () => {
  try {
    await navigator.share(shareData);
    resultPara.textContent = "MDN shared successfully";
  } catch (err) {
    resultPara.textContent = `Error: ${err}`;
  }
});

以上示例取自我们的Web 共享测试（查看源代码）。你也可以在navigator.share()中看到此示例。

规范

规范
Web Share API

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

api.Navigator.canShare

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅

Web Share Target API