Persyaratan baru untuk Web Share API di iframe pihak ketiga

Untuk meningkatkan privasi dan keamanan, panggilan Web Share API di iframe pihak ketiga kini harus diizinkan secara eksplisit.

Thomas Steiner

Artikel ini membahas perubahan yang berpotensi dapat menyebabkan gangguan pada Web Share API. Perubahan ini sudah tersedia di Firefox, dan akan diterapkan di Chrome mulai versi 110, dan diperkirakan akan segera diterapkan di Safari.

Web Share API memungkinkan Anda membagikan teks, URL, atau file. Dalam bentuknya yang paling sederhana, kode yang dibagikan 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 terjadi dalam iframe pihak ketiga, perubahan spesifikasi terbaru mengharuskan Anda mengizinkan operasi secara eksplisit. Lakukan hal ini dengan menambahkan atribut allow ke tag <iframe> dengan nilai web-share. Parameter ini memberi tahu browser bahwa situs penyematan memungkinkan iframe pihak ketiga yang tersemat 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 di demo on Glitch dan melihat kode sumber. Jika atribut tidak diberikan, NotAllowedError akan ditampilkan dengan pesan Failed to execute 'share' on 'Navigator': Permission denied. Batasan ini telah disetujui oleh semua vendor browser untuk meningkatkan privasi dan keamanan pengguna serta untuk mencegah pihak tidak bertanggung jawab, misalnya, iklan yang menyalahgunakan, agar tidak memicu tindakan pembagian yang tidak terduga.