Google Pay
Pelajari cara menerima pembayaran menggunakan Google Pay.
Google Pay memungkinkan pelanggan melakukan pembayaran di aplikasi atau situs web Anda menggunakan kartu kredit atau debit yang disimpan ke Akun Google mereka, termasuk yang dari Google Play, YouTube, Chrome, atau perangkat Android. Gunakan Google Pay API untuk meminta kartu kredit atau debit yang disimpan di akun Google pelanggan Anda.
Google Pay sepenuhnya kompatibel dengan produk dan fitur Stripe (misalnya, pembayaran rutin), sehingga Anda dapat menggunakannya sebagai pengganti formulir pembayaran tradisional bila memungkinkan. Gunakan Google Pay untuk menerima pembayaran barang fisik, donasi, langganan, dan lain-lain.
Menggunakan Stripe dan Google Pay dibandingkan sistem tagihan Google Play![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
Untuk penjualan barang dan layanan fisik, aplikasi Anda dapat menerima Google Pay atau metode pembayaran lain yang didukung Stripe. Pembayaran tersebut diproses melalui Stripe, dan Anda hanya perlu membayar biaya pemrosesan Stripe. Namun, pembelian dalam aplikasi dari produk dan konten digital harus menggunakan sistem tagihan Google Play. Pembayaran tersebut diproses oleh Google serta dikenakan biaya transaksinya.
Untuk informasi selengkapnya tentang pembelian mana yang harus menggunakan sistem tagihan Google Play, lihat ketentuan pengembang Google Play.
React Native SDK Stripe adalah cara tercepat dan termudah untuk mulai menerima Google Pay di aplikasi React Native Anda. Komponen PlatformPayButton membungkus UI yang diperlukan Google, serta Anda dapat menggunakan metode confirmPlatformPayPayment
dan createPlatformPayPaymentMethod
untuk mengumpulkan atau membuat pembayaran secara lancar di aplikasi dengan penyiapan minimal.
Siapkan StripeSisi serverSisi client![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
Sisi server![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
Integrasi ini memerlukan endpoint di server Anda yang berbicara dengan API Stripe. Gunakan pustaka resmi kami untuk akses ke API Stripe dari server Anda:
Sisi client![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
React Native SDK adalah sumber terbuka dan didokumentasikan lengkap. Secara internal, SDK iOS asli dan SDK Android digunakan. Untuk menginstal React Native SDK Stripe, jalankan salah satu perintah berikut di direktori proyek (bergantung pada manajer paket yang Anda gunakan):
Selanjutnya, instal beberapa dependensi lain yang diperlukan:
- Untuk iOS, navigasikan ke direktori ios dan jalankan
pod install
untuk memastikan bahwa Anda juga menginstal dependensi asli yang diperlukan. - Untuk Android, tidak ada lagi ketergantungan yang harus diinstal.
Inisialisasi Stripe![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
To initialize Stripe in your React Native app, either wrap your payment screen with the StripeProvider
component, or use the initStripe
initialization method. Only the API publishable key in publishableKey
is required. The following example shows how to initialize Stripe using the StripeProvider
component.
import { StripeProvider } from '@stripe/stripe-react-native'; function App() { const [publishableKey, setPublishableKey] = useState(''); const fetchPublishableKey = async () => { const key = await fetchKey(); // fetch key from your server here setPublishableKey(key); }; useEffect(() => { fetchPublishableKey(); }, []); return ( <StripeProvider publishableKey={publishableKey} merchantIdentifier="merchant.identifier" // required for Apple Pay urlScheme="your-url-scheme" // required for 3D Secure and bank redirects > // Your app code here </StripeProvider> ); }
Aktifkan Google Pay![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
Untuk menggunakan Google Pay, pertama aktifkan Google Pay API dengan menambahkan yang berikut ini ke tag <application>
AndroidManifest.xml Anda:
<application> ... <meta-data android:name="com.google.android.gms.wallet.api.enabled" android:value="true" /> </application>
Untuk detail selengkapnya, lihat Siapkan Google Pay API untuk Android dari Google Pay.
Buat PaymentIntentSisi server![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
Pertama, buat PaymentIntent
pada server Anda serta tentukan jumlah yang akan dikumpulkan dan mata uangnya. Jika Anda sudah memiliki integrasi menggunakan Payment Intents API, tambahkan card
ke daftar tipe metode pembayaran untuk PaymentIntent
(ini juga merupakan metode pembayaran default jika tidak ada yang diberikan):
PaymentIntent menyertakan client secret. Anda dapat menggunakan client secret di aplikasi React Native untuk menyelesaikan proses pembayaran dengan aman, bukan meneruskan seluruh objek PaymentIntent kembali. Di aplikasi, minta PaymentIntent dari server Anda dan simpan client secret-nya.
Inisialisasikan Google PaySisi klien![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
Pertama, periksa apakah perangkat mendukung Google Pay dengan memanggil isPlatformPaySupported
.
import { usePlatformPay } from '@stripe/stripe-react-native'; function PaymentScreen() { const { isPlatformPaySupported } = usePlatformPay(); React.useEffect(() => { (async function () { if (!(await isPlatformPaySupported({ googlePay: {testEnv: true} }))) { Alert.alert('Google Pay is not supported.'); return; } })(); }, []); ... return ( <View > ... </View> ); }
Tampilkan lembar Google PaySisi klien![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
Setelah Anda mengetahui bahwa Google Pay tersedia dan aplikasi Anda telah memperoleh client secret PaymentIntent
atau SetupIntent
, panggil confirmPlatformPayPayment
. Saat mengonfirmasi SetupIntent
, gunakan confirmPlatformPaySetupIntent
sebagai gantinya.
import {PlatformPayButton, usePlatformPay} from '@stripe/stripe-react-native'; function PaymentScreen() { const { isPlatformPaySupported, confirmPlatformPayPayment, } = usePlatformPay(); React.useEffect(() => { ... // see above }, []); const fetchPaymentIntentClientSecret = async () => { // Fetch payment intent created on the server, see above const response = await fetch(`${API_URL}/create-payment-intent`, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ currency: 'usd', }), }); const { clientSecret } = await response.json(); return clientSecret; }; const pay = async () => { const clientSecret = await fetchPaymentIntentClientSecret(); const { error } = await confirmPlatformPayPayment( clientSecret, { googlePay: { testEnv: true, merchantName: 'My merchant name', merchantCountryCode: 'US', currencyCode: 'USD', billingAddressConfig: { format: PlatformPay.BillingAddressFormat.Full, isPhoneNumberRequired: true, isRequired: true, }, }, } ); if (error) { Alert.alert(error.code, error.message); // Update UI to prompt user to retry payment (and possibly another payment method) return; } Alert.alert('Success', 'The payment was confirmed successfully.'); }; return ( <View > <PlatformPayButton type={PlatformPay.ButtonType.Pay} onPress={pay} style={{ width: '100%', height: 50, }} /> </View> ); }
Live dengan Google Pay![](https://b.stripecdn.com/docs-statics-srv/assets/fcc3a1c24df6fcffface6110ca4963de.svg)
Ikuti petunjuk Google untuk meminta akses produksi bagi aplikasi Anda. Pilih tipe integrasi Gateway bila diminta, dan berikan cuplikan layar aplikasi Anda untuk ditinjau.
Setelah aplikasi disetujui, coba integrasi Anda dalam produksi dengan menggunakan testEnv: false
, dan meluncurkan Google Pay dari build rilis aplikasi Anda yang ditandatangani. Ingatlah untuk menggunakan kunci API mode live. Anda dapat menggunakan PaymentIntent
dengan capture_
= manual
untuk memproses transaksi tanpa menarik pembayaran.