Web Share API 在 iOS 上不起作用：Angular答案

【问题标题】：Web Share API not working on iOS: AngularWeb Share API 在 iOS 上不起作用：Angular
【发布时间】：2020-05-13 12:17:49
【问题描述】：

我正在尝试通过网络共享像本机应用程序一样的图像。我也在使用 Angular。我使用了网络共享 API。这在 Android 上正常工作，但是在 iOS（Safari 和 Chrome）中会引发错误。我正在使用共享按钮来触发它。

这是我的代码：

if (
      this.windowNavigator.canShare &&
      this.windowNavigator.canShare({ files: [file] })
    ) {
      this.windowNavigator
        .share({
          files: [file],
          title: "Vacation Pictures",
          text: "Photos from September 27 to October 14.",
        })
        .then(() => console.log("Share was successful."))
        .catch((error) => console.log("Sharing failed", error));
    } else {
      console.error("Cannot use Web Share API");
    }

我收到的错误是：Cannot use Web Share API

如果浏览器不受支持，通常会发生这种情况。但是，根据https://caniuse.com/#search=web%20share 的说法，iOS 上的 Safari 13 是受支持的。请注意，我尝试将导航器对象记录到控制台，并且它确实具有 share() 原型。我在 HTTPS 服务器上运行它。请指导我如何进行。

【问题讨论】：

标签： javascript angular typescript web-share

【解决方案1】：

如您所知，您收到的错误消息是由您自己的代码传播的。当navigator 没有canShare 属性或navigator.canShare({ files: [file] }) 返回错误时，您会记录错误。

但是您需要使用的 API 是 navigator.share 不是 navigator.canShare 因为对后者的支持要有限得多。

根据截至 2020 年 5 月 13 日的 MDN：

要解决此问题，请考虑以下方法

if (typeof this.windowNavigator.share === "function") {
  try {
    await this.windowNavigator.share({
      files: [file],
      title: "Vacation Pictures",
      text: "Photos from September 27 to October 14.",
    });
    console.log("Share was successful.");
  }
  catch (error) {
    console.log("Sharing failed", error);
  }
}
else {
  console.error("Cannot use Web Share API: API unavailable.");
}

【讨论】：

也许我们需要navigator.canCanShare，但我想对它的支持会更加有限
@George 确实如此。您可以使用 if (typeof this.windowNavigator.canShare !== "function") Object.defineProperty(this.windowNavigator, "canShare", {value: function() { return typeof this.share === "function"; }) 之类的东西修补/sudo 填充 canShare 函数，以使您能够编写更好的代码，但这并不能验证共享类型的可用性

【解决方案2】：

编辑（2021 年 6 月 9 日）：Web Share API Level 2 在 iOS 15 Developer Beta 中默认可用和可用，这意味着它很可能会在 iOS 的最终公开版本中可用15.

正如 Aluan 所说，API 的支持有限，iOS 上根本不支持。请记住，这意味着它不受任何 iOS 浏览器的支持，即使是 Chrome，因为 iOS 上的所有浏览器都使用相同的 (WebKit) 引擎。

来自App Store Review Guidelines：

2.5.6 浏览网页的应用程序必须使用适当的 WebKit 框架和 WebKit Javascript。

【讨论】：

那么你的理想实现是什么样的？