时间戳

首页 > 解决方案 > NotAllowedError：必须处理用户手势才能执行共享请求。navigator.share

jquery - NotAllowedError：必须处理用户手势才能执行共享请求。navigator.share

问题描述

我有一个简单的页面，其中包含我通过 AJAX 请求处理的一些详细信息。在 AJAX 调用的成功回调中，我试图触发navigator.share它给我一个错误：

NotAllowedError：必须处理用户手势才能执行共享请求。

一些示例代码如下所示：

$("#form-button").on('click', function (event) {
  var ele = $(this);
  event.preventDefault();
  $.ajax({
    // ...
    dataType: "json",
    data: { "foo": "bar" },
    success: function (response) {
      if (navigator.share) {
        navigator.share({
          title: response.text,
          text: response.text,
          url: response.href
        }).then(function () {
          alert('Successful share')
        }).catch(function (error) {
          alert('Error sharing: ' + error);
        });
      }
    },
  });
});

来自Google 开发者网站的 Wuoting指出：

...您只能调用 API 以响应用户操作，例如单击（例如，您不能在页面加载过程中调用 navigator.share）

如果我没有 AJAX 调用并直接navigator.share在 click 事件下触发，但当我将其放入 AJAX 回调时则不会。我希望 API 会检查事件链。

我必须使用哪些替代方法才能使其发挥作用？我试过保留一个虚拟按钮并触发点击。

标签： jquerygoogle-chromesharemobile-chrome

解决方案

Chromium 目前似乎显示了拒绝数据类型的错误错误消息，例如尝试共享 pdf 文件；也不允许共享 JSON 文件。

Chromium 拒绝“共享”的其他情况也可能会给您同样的错误消息。例如，在我的情况下，我在本地测试（file://...）或使用“http”而不是“https”。

在我找到此信息的地方查看此推文： https ://twitter.com/daviddalbusco/status/1344641231184396288

并且允许的文件扩展名列表在那里： https ://docs.google.com/document/d/1tKPkHA5nnJtmh2TgqWmGSREUzXgMUFDL6yMdVZHqUsg/

[编辑] 我确认相同的代码在移动 Chrome 上运行良好，但在桌面 Chrome 89 上失败，如下所示：

  • 如果我在调试器中选中“捕获异常时暂停”，我会收到错误消息：“DOMException：无法在“导航器”上执行“共享”：必须处理用户手势才能执行共享请求。”
  • 如果我不检查“捕获异常时暂停”，我会得到几秒钟的“延迟”，然后承诺会失败并出现错误“DOMException：共享已取消”。

简而言之，我的回答是：“Chrome 桌面 89 还没有为 Web Share API 做好准备”（如果你尝试，它会给你误导性的错误消息）。

推荐阅读