Zum besseren Schutz der Privatsphäre und Sicherheit müssen Web Share API-Aufrufe in Drittanbieter-Iframes jetzt ausdrücklich zugelassen werden.
In diesem Artikel geht es um eine potenziell funktionsgefährdende Änderung an der Web Share API. Diese Änderung ist bereits in Firefox verfügbar, wird in Chrome ab Version 110 eingeführt und wird voraussichtlich bald in Safari verfügbar sein.
Mit der Web Share API können Sie Text, URLs oder Dateien teilen. In seiner einfachsten Form sieht der Freigabecode so aus:
try {
await navigator.share({
title: 'Title',
text: 'Text',
url: location.href,
});
} catch (err) {
console.error(`${err.name}: ${err.message}`);
}
Wenn eine Freigabeaktion in einem Drittanbieter-Frame erfolgen muss, müssen Sie aufgrund einer neueren Spezifikationsänderung die Aktion explizit zulassen. Fügen Sie dazu dem <iframe>-Tag ein allow-Attribut mit dem Wert web-share hinzu. Dadurch wird dem Browser mitgeteilt, dass die Website, auf der das eingebettete iFrame des Drittanbieters eingebunden ist, die Freigabeaktion auslösen darf.
<!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>
In einer Demo auf Glitch können Sie sich das in Aktion ansehen und den Quellcode ansehen.
Wenn Sie das Attribut nicht angeben, erhalten Sie eine NotAllowedError mit der Meldung Failed to execute 'share' on 'Navigator': Permission denied. Diese Einschränkung wurde von allen Browseranbietern vereinbart, um den Datenschutz und die Sicherheit der Nutzer zu verbessern und zu verhindern, dass böswillige Akteure, z. B. durch missbräuchliche Anzeigen, unerwartete Freigabeaktionen auslösen.