Untuk meningkatkan privasi dan keamanan, panggilan Web Share API di iframe pihak ketiga kini harus diizinkan secara eksplisit.
Artikel ini membahas perubahan yang berpotensi menyebabkan gangguan di Web Share API. Perubahan ini sudah ada di Firefox, akan hadir di Chrome mulai versi 110, dan diperkirakan akan hadir di Safari dalam waktu dekat.
Web Share API memungkinkan Anda membagikan teks, URL, atau file. Dalam bentuk yang paling sederhana, kode berbagi akan terlihat seperti ini:
try {
await navigator.share({
title: 'Title',
text: 'Text',
url: location.href,
});
} catch (err) {
console.error(`${err.name}: ${err.message}`);
}
Jika tindakan berbagi perlu dilakukan di iframe pihak ketiga, perubahan spesifikasi terbaru mengharuskan Anda mengizinkan
operasi secara eksplisit. Lakukan ini dengan menambahkan atribut allow
ke tag <iframe> dengan nilai web-share. Hal ini memberi tahu browser bahwa situs penyematan mengizinkan iframe
pihak ketiga tersemat untuk memicu tindakan berbagi.
<!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>
Anda dapat melihat cara kerjanya dalam demo di Glitch
dan melihat
kode sumber.
Kegagalan dalam memberikan atribut akan menghasilkan NotAllowedError dengan pesan
Failed to execute 'share' on 'Navigator': Permission denied. Batasan ini disetujui oleh semua
vendor browser untuk meningkatkan privasi dan keamanan pengguna serta mencegah pihak tidak bertanggung jawab, misalnya,
iklan yang melanggar, memicu tindakan berbagi yang tidak terduga.