How to use WebShareAPI preceded by an AJAX call in Safari?

问题

When users click the share button on our paywalled site, we generate a token via an async call that allows the people clicking on the share link to bypass the paywall.

I've added support for Web Share API first calling the token before triggering navigator.share - along these lines:

fetchCallForLink()
  .then((url) => {
    navigator.share({
      title: 'Test Title',
      url,
    });

This is working fine on Chrome / Android which supports Web Share.

However on Safari, I am getting a not allowed error.

The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission

(This only happens on the first share attempt as I save the response to the window and therefore on subsequent clicks it avoids the AJAX call and works just fine.)

Because of the number of readers we have and the small number that actually use the share option, it would be expensive to make the AJAX call for ever page load (vs. only when user expresses intent to share).

Being that this works fine in Chrome I am assuming nothing in the spec prohibits an AJAX call before launching Web Share.

Might this be a bug in Safari's implementation? Or the reverse and actually Chrome shouldn't be allowing?

Example: https://mkonikov.com/web-share-testing/ I've added a toggle to share with or without fetching first. This share fails only when fetch is enabled. (Also worth noting, sharing will fail with a setTimeout of over 1000ms)

Update: I have created a bug with the web-kit team here: https://bugs.webkit.org/show_bug.cgi?id=197779.

Update 2: Here's a relevant Twitter thread with some folks from W3C https://twitter.com/marcosc/status/1167607222009884672

回答1:

Exciting news! After filing a bug with the webkit team here, this issue has got some traction and as noted in the bug discussion, this initial implementation was deliberate. Thankfully this has been fixed and the latest Safari Technology Preview release notes includes this exciting paragraph:

"Added support for a user gesture to allow using the Web Share API even when preceded by an XHR call" https://developer.apple.com/safari/technology-preview/release-notes/

Looking forward to it coming to the rest of Safari soon!

来源：https://stackoverflow.com/questions/56046434/how-to-use-webshareapi-preceded-by-an-ajax-call-in-safari

标签

javascript

google-chrome

web

safari

navigator