Nieuwe vereisten voor de Web Share API in iframes van derden

Voor verbeterde privacy en beveiliging moeten Web Share API-aanroepen in iframes van derden nu expliciet worden toegestaan.

Dit artikel behandelt een mogelijk belangrijke wijziging in de Web Share API. Deze wijziging is al beschikbaar in Firefox, zal vanaf versie 110 ook beschikbaar zijn in Chrome en zal naar verwachting binnenkort ook beschikbaar zijn in Safari .

Met de Web Share API kun je tekst, URL's of bestanden delen. In de eenvoudigste vorm ziet de sharecode er ongeveer zo uit:

try {
  await navigator.share({
    title: 'Title',
    text: 'Text',
    url: location.href,
  });
} catch (err) {
  console.error(`${err.name}: ${err.message}`);
}

Als een deelactie moet plaatsvinden in een iframe van derden, vereist een recente specificatiewijziging dat u de bewerking expliciet toestaat. Doe dit door een allow -kenmerk toe te voegen aan de <iframe> -tag met de waarde web-share . Dit vertelt de browser dat de embeddingsite toestaat dat de ingesloten iframe van derden de deelactie activeert.

<!DOCTYPE html>
<html lang="en">
  <body>
    <h1>Web Share in third-party iframes</h1>
    <!-- The embedding page is hosted on https://example.com/index.html. -->
    <iframe allow="web-share" src="https://third-party.example.com/iframe.html"></iframe>
  </body>
</html>

U kunt dit in actie zien in een demo op GitHub en de broncode bekijken. Als u het kenmerk niet opgeeft, resulteert dit in een NotAllowedError met de melding Failed to execute 'share' on 'Navigator': Permission denied . Deze beperking is overeengekomen door alle browserleveranciers om de privacy en veiligheid van gebruikers te verbeteren en te voorkomen dat kwaadwillenden, bijvoorbeeld beledigende advertenties, onverwachte deelacties activeren.