Google Pay di dalam iframe sandbox untuk memenuhi kepatuhan PCI DSS v4

10 JUNI 2025
Dominik Mengelt Developer Relations Engineer Payments

Jika Anda mengembangkan atau mengelola halaman checkout, Anda mungkin menemukan PCI DSS v4 yang menyertakan persyaratan berikut di bawah versi 6.4.3:


Semua skrip halaman pembayaran yang dimuat dan dijalankan di browser konsumen akan dikelola seperti berikut:

  • Metode diimplementasikan untuk mengonfirmasi bahwa setiap skrip telah diotorisasi.

  • Metode diimplementasikan untuk memastikan integritas setiap skrip.

  • Inventarisasi semua skrip dikelola dengan justifikasi teknis atau bisnis tertulis mengenai alasan mengapa setiap skrip dibutuhkan.


Salah satu cara untuk memenuhi persyaratan ini adalah dengan menggunakan teknik seperti Subresource Integrity (SRI). Namun, proses build dan rilis Google Pay JavaScript (pay.js) tidak mendukung hash stabil jangka panjang yang diperlukan oleh teknik seperti SRI.


Menggunakan iframe sandbox

Menggunakan iframe sandbox akan menjawab setiap masalah kepatuhan karena skrip di dalam iFrame tidak akan memiliki akses ke DOM induk. Lihat ilustrasi berikut ini sebagai contoh:

sandboxed iframe
<iframe
  src="https://cdn.somewhereelse.com"
  allow="payment"
  sandbox="allow-scripts allow-popups allow-same-origin allow-forms">
</iframe>
JavaScript

Dalam kasus ini domain “cdn.somewhereelse.com” akan memuat file JavaScript pay.js Google Pay. Setelah transaksi berhasil, iframe bagian dalam akan dapat berkomunikasi dengan halaman induk melalui mekanisme seperti window.postMessage() jika diperlukan.

Agar Google Pay dapat berfungsi di semua browser, kita memerlukan 4 nilai atribut sandbox berikut ini sebagai tambahan untuk allow=”payment”:

  • allow-scripts

Untuk mengizinkan iframe mengeksekusi skrip (pay.js sebagai contoh)

  • allow-popups

Memungkinkan halaman sematan untuk membuat 'konteks penjelajahan turunan'. Dalam praktiknya, flag ini memungkinkan iframe sematan membuka tab dan jendela baru saat pengguna mengklik link.

  • allow-same-origin

Jika tidak diatur, dapat menyebabkan kegagalan dalam berbagai situasi pada browser. Jika diatur, iframe memiliki akses ke penyimpanan dan cookie halaman induk.

  • allow-forms

Memungkinkan formulir, seperti login Google Pay, untuk mengirimkan data.


Lihat halaman pengujian ini untuk melihat berbagai nilai sandbox iframe beraksi.


Shopify berhasil mendapatkan sertifikasi untuk PCI DSS v4

Google Pay bermitra dengan Shopify untuk mengimplementasikan solusi di atas. Shopify berhasil lulus audit PCI DSS v4 dengan menggunakan iframe sandbox untuk menampilkan tombol Google Pay. Inilah yang dikatakan Shopify:

Kami merancang Shopify Checkout agar kode Google Pay dieksekusi dalam lingkungan sandbox yang aman, yang memungkinkan kami menjaga integritas proses checkout dan mematuhi persyaratan PCI DSS V4.

Ilya Grigorik, Distinguished Engineer di Shopify


Untuk informasi selengkapnya tentang cara Shopify membangun solusi checkout mereka menggunakan iframe sandbox, postingan blog “Mendukung Checkout Berkinerja Tinggi dan Mematuhi PCI DSS v4 Shopify dengan Sandboxing” memuat penjelasannya.


Kesimpulan

Membungkus integrasi Google Pay Anda dalam iframe sandbox bisa membantu memenuhi persyaratan PCI DSS v4. Untuk bantuan lebih lanjut dalam implementasi, masuk ke Konsol Google Pay & Wallet untuk membuat tiket bantuan. Selain itu, Anda dapat bergabung dengan komunitas developer di saluran #payments di Discord.

Ikuti @GooglePayDevs di X untuk update mendatang. Jika ada pertanyaan, beri tag @GooglePayDevs dan sertakan #AskGooglePayDevs di tweet Anda.