Google uses AI technology to translate content into your preferred language. AI translations can contain errors.

Google Pay API: Melakukan vibe coding pada halaman checkout dengan server MCP dan Antigravity

1. Ringkasan

Pengembangan software modern dengan cepat beralih dari pemrograman imperatif ke pengembangan berbasis AI. Dalam codelab ini, Anda akan mempelajari cara membuat dan meningkatkan integrasi Google Pay menggunakan server MCP Google Pay & Wallet Developer (selanjutnya disebut server MCP Google Pay) dan Antigravity, alat yang dibuat khusus untuk AI.

Model Context Protocol (MCP) adalah standar terbuka yang memungkinkan model AI mengakses alat eksternal, dokumentasi aktif, dan endpoint API jarak jauh dengan aman. Melalui alur kerja yang dibuat khusus untuk AI di Antigravity, Anda akan menyiapkan lingkungan untuk berkomunikasi dengan server MCP Google Pay dan membuat tombol Google Pay yang siap produksi untuk halaman checkout dengan cepat dari awal.

Selanjutnya, Anda akan menggunakan metodologi pengembangan berbasis spesifikasi untuk meningkatkan integrasi dengan fitur API baru—khususnya mengaktifkan Transaksi yang Dimulai Penjual (MIT) untuk pembayaran berulang dan menggunakan sinyal cardFundingSource untuk perutean dan harga dinamis. Terakhir, Anda akan mengonfigurasi pipeline pemantauan otonom yang didukung LLM untuk mengamati dan memperbaiki masalah checkout dalam semalam.

Yang akan Anda pelajari

Cara menyiapkan dan menghubungkan server MCP Google Pay ke Antigravity atau alat AI lainnya
Cara menggunakan server MCP Google Pay untuk mengkueri dokumentasi
Cara membuat struktur integrasi checkout Google Pay terbaik di kelasnya langsung di Antigravity
Cara menerapkan perutean dan harga dinamis dengan pengembangan berbasis spesifikasi
Cara meningkatkan kasus penggunaan langganan berulang dengan pengembangan berbasis spesifikasi
Cara men-deploy pemantauan jangka panjang dan pipeline agentik otomatis menggunakan Antigravity
Cara menerapkan checkout tamu cepat untuk mengoptimalkan funnel konversi

2. Penyiapan dan persyaratan

Sebelum memulai

Untuk menggunakan server MCP Google Pay, Anda harus membuat project Google Cloud dan mengaktifkan Google Pay & Wallet Developer API.

Di konsol Cloud, pada halaman pemilih project, pilih atau buat project Google Cloud.
Aktifkan Google Pay & Wallet Developer API.
- Untuk mengaktifkan API, Anda memerlukan peran IAM Service Usage Admin (roles/serviceusage.serviceUsageAdmin), yang berisi izin serviceusage.services.enable. Pelajari cara memberikan peran.

Peran yang diperlukan

Untuk mendapatkan izin yang diperlukan untuk menggunakan server MCP Google Pay, minta administrator Anda untuk memberi Anda peran IAM berikut di project Google Cloud:

Melakukan panggilan alat MCP: Pengguna Alat MCP (roles/mcp.toolUser)

Untuk mengetahui informasi selengkapnya, lihat Mengelola akses ke project.

Autentikasi dan otorisasi

Server MCP Google Pay menggunakan protokol OAuth 2.0 dengan IAM untuk autentikasi dan otorisasi.

Ikuti langkah-langkah berikut untuk membuat ID dan secret klien OAuth 2.0 agar alat MCP Anda dapat mengakses resource Google Cloud:

Di konsol Google Cloud, buka Google Auth Platform > Clients > Create client.
Dalam daftar Application type, pilih jenis yang sesuai untuk aplikasi AI Anda:
- Untuk Antigravity, Claude.ai, Claude Code, dan ChatGPT, pilih Aplikasi web.
- Untuk Gemini CLI dan VS Code, pilih Aplikasi desktop.
Di kolom Name, masukkan nama aplikasi Anda (misalnya, Antigravity).
Di bagian Authorized redirect URIs, klik + Add URI, lalu tambahkan URI pengalihan yang diperlukan untuk aplikasi AI Anda:
- Antigravity: https://antigravity.google/oauth-callback
- Alat AI lainnya: lihat Penyiapan Klien OAuth.
Klik Buat. Setelah dibuat, buka detail klien. Salin client ID dan rahasia klien, lalu simpan dengan aman.
Di Konsol Google Cloud, buka Google Auth Platform > Audience, klik Publish app, lalu klik Confirm untuk mengubah Publishing status menjadi In production.

3. Mengonfigurasi server MCP

Mengonfigurasi aplikasi AI Anda

Selanjutnya, Anda perlu memberikan detail konfigurasi server ke aplikasi AI Anda.

Antigravity 2.0

Untuk mengonfigurasi Antigravity 2.0:

Buka Settings > Customizations dan di bagian Installed MCP Servers, klik Open MCP Config untuk membuka file konfigurasi Antigravity (contoh: ~/.gemini/antigravity/mcp_config.json).

Tambahkan atau perbarui entri google-pay-wallet-dev di mcpServers dengan ID dan rahasia klien OAuth Anda (ganti ANTIGRAVITY_CLIENT_ID dan ANTIGRAVITY_CLIENT_SECRET dengan ID dan rahasia klien OAuth 2.0 yang dibuat):

{
  "mcpServers": {
    "google-pay-wallet-dev": {
      "serverUrl": "https://paydeveloper.googleapis.com/mcp",
      "oauth": {
        "clientId": "ANTIGRAVITY_CLIENT_ID",
        "clientSecret": "ANTIGRAVITY_CLIENT_SECRET"
      }
    }
  }
}

Buka Setelan > Penyesuaian dan di bagian Server MCP yang Terinstal, klik Muat Ulang.
Klik Authenticate dan selesaikan alur OAuth:
- Jika muncul pesan Google belum memverifikasi aplikasi ini, klik Lanjutan, lalu klik Buka antigravity.google (tidak aman) untuk melanjutkan. Peringatan ini ditampilkan karena klien OAuth Anda belum diverifikasi. Anda dapat melanjutkan dengan aman selama pengembangan.
- Pilih cakupan yang diperlukan (Lihat, edit, dan hapus integrasi Google Pay API Anda), lalu klik Lanjutkan untuk memberikan akses ke Antigravity.
Salin kode otorisasi dan kirimkan kode di jendela kode otorisasi.

Antigravity IDE

Untuk mengonfigurasi Antigravity IDE:

Di Antigravity IDE, klik menu Additional options di Agent pane > MCP Servers > Manage MCP Servers.

Di bagian atas panel Manage MCP Servers, klik View raw config untuk mengedit file mcp_config.json (ganti ANTIGRAVITY_CLIENT_ID dan ANTIGRAVITY_CLIENT_SECRET dengan client ID dan secret OAuth 2.0 yang dibuat): Antigravity Mengelola server MCP Lihat konfigurasi mentah

Antigravity Mengelola server MCP Lihat konfigurasi mentah

{
  "mcpServers": {
    "google-pay-wallet-dev": {
      "serverUrl": "https://paydeveloper.googleapis.com/mcp",
      "oauth": {
        "clientId": "ANTIGRAVITY_CLIENT_ID",
        "clientSecret": "ANTIGRAVITY_CLIENT_SECRET"
      }
    }
  }
}

Kembali ke Manage MCP servers, lalu klik Refresh. Mengklik Authenticate akan membuka tab Customizations di Agent Settings.
Klik Authenticate dan selesaikan alur OAuth:
- Jika muncul pesan Google belum memverifikasi aplikasi ini, klik Lanjutan, lalu klik Buka antigravity.google (tidak aman) untuk melanjutkan. Peringatan ini ditampilkan karena klien OAuth Anda belum diverifikasi. Anda dapat melanjutkan dengan aman selama pengembangan.
- Pilih cakupan yang diperlukan (Lihat, edit, dan hapus integrasi Google Pay API Anda), lalu klik Lanjutkan untuk memberikan akses ke Antigravity.
Salin kode otorisasi dan kirimkan kode di jendela kode otorisasi.

Alat AI lainnya

Untuk mengonfigurasi alat AI lainnya, lihat Panduan Mengonfigurasi aplikasi AI Anda.

4. Menyiapkan integrasi Google Pay baru ke dalam checkout

Pengembangan software tradisional sering kali memerlukan penelusuran spesifikasi API yang ekstensif, penyalinan kode boilerplate, dan penyiapan parameter. Sebaliknya, dengan server MCP Google Pay yang dikonfigurasi di Antigravity, Anda dapat meminta LLM untuk membuat pengalaman checkout yang siap produksi.

Minta Antigravity untuk membuat checkout: Buka sesi chat Antigravity yang aktif (dengan server MCP Google Pay diaktifkan) dan berikan perintah pembuatan berikut:

Act as a developer and integrate the Google Pay API into a checkout page using HTML, CSS, and vanilla JavaScript. 

Please ensure the implementation follows these Google Pay best practices:
1. *Check Readiness*: As the first step, call `isReadyToPay()`. Only render the Google Pay button if this method returns true.
2. *Layout & Placement*: Set Google Pay as the default payment option. Position the Google Pay button at the very top of the payment list, above any credit card entry forms.
3. *Button Styling*: Render a dynamic button by setting `buttonType` to `'buy'` or `'pay'` so it previews the user''s saved card. Ensure the button theme contrasts with the page background.
4. *Payment Methods*: In `allowedAuthMethods`, specify both `'PAN_ONLY'` and `'CRYPTOGRAM_3DS'` so that Google Pay accepts both standard cards-on-file, and device tokens. 
5. *Card Networks*: Add `'VISA'`, `'MASTERCARD'`, and `'AMEX'` to `allowedCardNetworks`.
6. *Transaction Info*: Set the `checkoutOption` parameter to `'COMPLETE_IMMEDIATE_PURCHASE'` so Google Pay sheet displays a "Pay" button instead of "Continue".
7. *3D-Secure Step-Up*: Treat Google Pay risk checks consistently with regular cards. If your standard checkout flow triggers a 3D-S step-up for normal cards, ensure risk-based 3D-S is triggered based on signals returned in the `loadPaymentData()` response.
8. *Testing*: Serve and test the checkout page locally using a Python3 web server.

Izinkan LLM terhubung ke alat MCP: LLM menjalankan search_documentation dengan kueri seperti permintaan loadPaymentData. Server MCP Google Pay mengkueri embedding vektor RAG-nya dan menampilkan skema JSON persis seperti yang diperlukan oleh Google Pay.
Mengamati eksekusi dan pembuatan kode: Antigravity menggabungkan perintah Anda dengan output alat MCP untuk membuat desain awal yang dapat Anda tinjau dan tambahkan komentar untuk penyesuaian atau disetujui:

Gambar berikut menunjukkan demo yang dihasilkan. Perhatikan bahwa tampilan dan nuansa demo dapat bervariasi berdasarkan konteks Antigravity Anda:

Pemecahan masalah

Jika pengalaman checkout yang dihasilkan tidak sesuai dengan harapan Anda, Anda dapat menyesuaikannya dengan Antigravity. Berikut beberapa contohnya:

Menyesuaikan kontras dan gaya visual tombol: Jika tombol tidak sesuai dengan tema visual situs Anda, perintah:

The page background is dark. Please update `createButton()` to use `buttonColor: 'white'` and adjust container margins so it sits cleanly above our credit card form.

Memvalidasi ID penjual: Jika Anda perlu beralih antara konfigurasi penjual TEST dan PRODUCTION, perintah:

Use `list_google_pay_integrations` to fetch our latest test or production merchant ID and explicitly inject it into `merchantInfo.merchantId`.

Memeriksa sinyal peningkatan 3D Secure: Untuk memeriksa apakah autentikasi peningkatan 3D Secure dievaluasi dengan benar terhadap sinyal risiko perangkat assuranceDetails, perintah:

Please verify in `onGooglePaymentButtonClicked()` if 3D-Secure step-up logic is conditionally triggered based upon the `assuranceDetails` signal returned inside the `loadPaymentData()` response.

5. Mengoptimalkan UX untuk biaya tambahan dinamis

Terkadang, penjual dan PSP perlu menghitung biaya tambahan, diskon, atau harga dinamis berdasarkan jenis kartu yang mendasarinya. Misalnya, menerapkan biaya tambahan 0,1% untuk kartu debit/prabayar dibandingkan dengan biaya tambahan 0,5% untuk kartu kredit. Google Pay memberikan sinyal penting ini melalui cardFundingSource.

Memahami nuansa `cardFundingSource`

Sebelum menerapkan harga dinamis, Anda harus memahami perilaku sinyal ini di berbagai lingkungan:

Lingkungan pengujian: Perhatikan bahwa lembar pembayaran Google Pay di TEST selalu menampilkan total harga. Penjual harus menggunakan sinyal dari respons dan menampilkan harga akhir (termasuk biaya tambahan) di layar konfirmasi pesanan mereka sendiri sebelum otorisasi pembayaran, seperti yang ditunjukkan dalam contoh ini.
Deployment produksi: Jika Anda perlu menyembunyikan total harga di lembar pembayaran Google Pay, hubungi kontak Google Anda untuk meminta agar ID Merchant Anda dimasukkan dalam daftar yang diizinkan.

Pengembangan berbasis spesifikasi untuk penetapan harga dinamis

Menggunakan alat MCP untuk mencari dokumentasi developer: Dalam sesi chat Antigravity yang aktif, minta LLM menggunakan SDD:

Enhance the Google Pay integrations according to business specification: 
- Use "sabre" as the gateway for the TEST environment.
- Calculate a 0.1% extra fee for DEBIT and PREPAID cards, and a 0.5% extra fee for CREDIT cards. 
- After the surcharge is calculated, update the checkout confirmation screen so the user reviews the final price before acquirer authorization.
Use `search_documentation` to look up the technical specification for consuming `cardFundingSource` signal of Google Pay API.

Memverifikasi penerapan LLM: Dengan langsung membuat kueri dokumentasi menggunakan MCP, LLM mengekstrak spesifikasi teknis yang tepat untuk memperbarui penerapan penghitungan harga. Amati halaman pengujian untuk memverifikasi dan meninjau perubahan UI biaya tambahan di layar konfirmasi Anda:
Layar Pesanan Akhir Peninjauan Biaya Tambahan dan Harga Dinamis

Layar Pesanan Akhir Peninjauan Biaya Tambahan dan Harga Dinamis

Berikut adalah kode JavaScript yang ditingkatkan yang dihasilkan oleh LLM:

/**
 * Calculates an extra fee based on the card funding source signal.
 * @param {object} paymentData - The payment data object from the API response.
 */
function processPayment(paymentData) {
  // Access the card funding source from the nested API response info object
  const cardFundingSource = paymentData.paymentMethodData.info.cardFundingSource;
  let totalPrice = 10.00;
  let extraFee = 0;

  switch (cardFundingSource) {
    case 'DEBIT':
    case 'PREPAID':
      extraFee = totalPrice * 0.001; // Apply 0.1% fee
      break;
    case 'CREDIT':
    default:
      extraFee = totalPrice * 0.005; // Apply 0.5% fee
      break;
  }

  const finalOrderTotal = totalPrice + extraFee;
  console.log(`Card Type: ${cardFundingSource} | Fee: $${extraFee.toFixed(3)} | Final Total: $${finalOrderTotal.toFixed(2)}`);

  // Update your checkout confirmation screen so the user reviews the final price before acquirer authorization
  displayFinalConfirmationScreen(finalOrderTotal, extraFee);
}

6. [Opsional] Meningkatkan tingkat keberhasilan pembayaran untuk pembayaran berulang

Jika bisnis Anda beroperasi dengan model langganan, penagihan utilitas berulang, atau keanggotaan, Anda mungkin perlu memproses pembayaran tanpa mengharuskan pengguna melakukan autentikasi ulang pada setiap siklus penagihan. Untuk pembayaran berulang ini. Spesifikasi MIT kami memberikan visibilitas yang lebih baik untuk jenis transaksi, detail penagihan, dan kelancaran kesinambungan pembayaran.

Menerapkan pengembangan berbasis spesifikasi

Daripada membiarkan LLM menelusuri web secara acak—yang berisiko menggunakan spesifikasi teknis yang tidak akurat, Anda menginstruksikan LLM untuk menggunakan alat search_documentation server MCP Google Pay.

Perintah untuk pengambilan spesifikasi: Dalam sesi chat Antigravity yang aktif, berikan perintah LLM:

Enhance the Google Pay integrations to support new recurring business requirement:
- Update Google Pay integrations to support a monthly recurring subscription of $14.99.
- Use `search_documentation` to look up the technical specification for `RecurringTransactionInfo` and MIT in Google Pay API.

Tinjau penerapan kode yang ditingkatkan: LLM memperbarui onGooglePaymentButtonClicked dengan parameter MIT yang divalidasi spesifikasinya:

function getGoogleRecurringTransactionInfo() {
  return {
    currencyCode: 'USD',
    countryCode: 'US',
    transactionId: 'sub-1499-monthly-' + Date.now(),
    tokenUpdateUrl: 'https://api.acmestore.com/token/update',
    managementUrl: 'https://acmestore.com/account/subscriptions',
    billingAgreement: 'Monthly recurring subscription of $14.99 for Acme Pro. Cancel anytime in your account settings.',
    immediateTotalPrice: '14.99',
    recurrenceItems: [
      {
        label: "Acme Pro Monthly Subscription",
        price: "14.99",
        priceStatus: "FINAL",
        recurrencePeriod: "MONTH",
        recurrencePeriodCount: 1
      }
    ]
  };
}

Amati halaman pengujian untuk memverifikasi bahwa detail langganan berulang khusus muncul di lembar pembayaran Google Pay: UI lembar gaji berulang MIT Google Pay

Pemecahan masalah

Jika Anda mendapatkan error:

Payment failed to initialize: Exactly one of transactionInfo, automaticReloadTransactionInfo, deferredTransactionInfo, or recurringTransactionInfo must be set!

Anda dapat menyalin error ke sesi chat Antigravity aktif untuk memperbaiki error secara otomatis menggunakan alat MCP search_documentation.

7. [Opsional] Mengamankan konversi dengan pemantauan agentik jangka panjang

Bayangkan tim kepemimpinan Anda baru saja memberi Anda tujuan penting: meningkatkan rasio konversi pembayaran secara keseluruhan sebesar X% tahun ini. Mencapai dan mempertahankan konversi checkout yang tinggi bukan hanya tentang integrasi awal—tindakan ini memerlukan pemantauan transaksi secara berkelanjutan, deteksi error API secara instan, dan penerapan pengoptimalan berbasis data secara proaktif.

Daripada memantau masalah pembayaran secara manual, Anda dapat mendelegasikan pemantauan berkelanjutan dan pengoptimalan konversi kepada agen. Dalam latihan ini, kita akan mempelajari cara menentukan pemantauan dan pengoptimalan konversi sebagai Keterampilan Agen Antigravitasi dan menjalankannya secara mandiri sebagai Tugas Jangka Panjang.

Membuat keterampilan agen Antigravitasi dan menjalankan sebagai tugas jangka panjang

Tentukan keterampilan pemantauan dan perbaikan (SKILL.md): Buat playbook keterampilan terstruktur bernama ~/.agents/skills/gpay-monitor-fix/SKILL.md (atau ~/.gemini/skills/gpay-monitor-fix/SKILL.md) di root ruang kerja Anda. Ganti YOUR_MERCHANT_ID dengan ID penjual Anda dari konsol Google Pay:

---
name: gpay-monitor-fix
description: Autonomously queries Google Pay merchant error metrics over long-horizon windows, root-causes checkout failures against official API specs, generates remediation patches, and proposes payment conversion optimization plans.
---

# Google Pay Long-Horizon Monitoring & Conversion Optimization Skill
When invoked for long-horizon monitoring and conversion optimization, execute the following autonomous loop:
1.  **Analyze production traffic:** Call the Google Pay MCP tool `query_merchant_error_metrics` targeting merchant ID YOUR_MERCHANT_ID for Time Range of TIME_RANGE_PAST_WEEK..
2.  **Evaluate error and drop-offs:** Check the returned metrics for error spikes (e.g., user cancellation errors, or `OR_BIBED_06` failures) that directly degrade conversion rates.
3.  **Perform diagnosis:** If an error anomaly or conversion bottleneck is detected, extract the failed request structure and query the `search_documentation` MCP tool with the exact error code or payload discrepancy based on Google Pay API specifications.
4.  **Synthesize automated optimization plan:** Correlate the failing payload against official RAG-retrieved schemas to identify root causes (e.g., incorrect `tokenizationSpecification` or missing mandatory MIT fields). Formulate a proactive optimization plan to streamline user checkout steps.
5.  **Generate onversion fix:** Create a code branch, apply the exact code fix to our checkout implementation (e.g., `checkout.js` or `main.js`), and open a Pull Request detailing the anomaly, root-cause diagnosis and verified code patch.

Jadwalkan tugas latar belakang dengan cakupan panjang di Antigravity: Setelah skill Anda ditentukan, dalam sesi Antigravity yang aktif, masukkan perintah /schedule untuk mengonfigurasi agen Antigravity:

/schedule
"Everyday at midnight, invoke @gpay-monitor-fix skill to check our checkout error metrics and conversion performance. If any anomaly spike is detected, diagnose the root cause, generate a fix pull request, and propose conversion optimization plans by morning."

Hasil eksekusi perintah antigravity /schedule

Anda dapat memasukkan perintah /schedule lagi tanpa argumen apa pun untuk memeriksa status tugas terjadwal yang aktif.

Atau, untuk menjalankan agen pemantauan dan pengoptimalan selama jangka waktu yang tidak ditentukan, Anda dapat memicu eksekusi berbasis sasaran Antigravity:

/goal
Invoke @gpay-monitor-fix to continuously monitor checkout traffic, investigate errors and propose optimizations. Do not mark this goal complete (<!-- GOAL_COMPLETE -->); continue monitoring and auditing indefinitely.

Tinjau hasil pengoptimalan otomatis: Dengan asumsi ada traffic produksi aktif yang mengalir melalui ID penjual Anda, saat Anda tiba di kantor pada pagi berikutnya, Anda akan melihat laporan pengoptimalan. Berikut ilustrasi laporan:

8. [Opsional] Meningkatkan konversi dengan checkout tamu cepat GPay

Alur checkout multi-langkah tradisional sering kali mengharuskan pengguna memasukkan informasi pengiriman dan penagihan yang panjang secara manual atau bahkan membuat akun, yang menimbulkan hambatan dan menyebabkan pengabaian di seluruh funnel konversi. Dengan menerapkan checkout tamu cepat langsung di halaman detail produk dengan Google Pay, Anda memungkinkan pengguna melakukan checkout dengan sedikit klik dan menghilangkan entri formulir manual dengan menarik kredensial yang telah disimpan sebelumnya dari akun Google mereka secara aman.

Pengembangan berbasis spesifikasi untuk pembayaran tamu

Perintah untuk pengambilan spesifikasi dan penerapan checkout tamu: Dalam sesi chat Antigravity aktif Anda, berikan perintah LLM:

Implement Google Pay for express guest checkout directly on the product details page. Ensure users select product attributes before clicking Google Pay (or checkout button).

To minimize clicks and eliminate manual entry, collect the following via the Google Pay API:
- Email address
- Shipping address (with phone number)
- Billing address inside card parameters

Use search_documentation for API specs.

Meninjau penerapan kode yang ditingkatkan: LLM memperbarui permintaan data pembayaran untuk mengumpulkan detail pengiriman, kontak, dan penagihan langsung melalui Google Pay API:

function getGooglePaymentDataRequest() {
  const paymentDataRequest = Object.assign({}, baseRequest);
  paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod];
  paymentDataRequest.transactionInfo = getGoogleTransactionInfo();
  paymentDataRequest.merchantInfo = getGoogleMerchantInfo();

  // Collect email address and shipping address (with phone number) for guest checkout
  paymentDataRequest.emailRequired = true;
  paymentDataRequest.shippingAddressRequired = true;
  paymentDataRequest.shippingAddressParameters = {
    phoneNumberRequired: true
  };

  return paymentDataRequest;
}

Dan di dalam cardPaymentMethod, parameter alamat penagihan dikonfigurasi:

const cardPaymentMethod = Object.assign({}, baseCardPaymentMethod, {
  tokenizationSpecification: tokenizationSpecification,
  billingAddressRequired: true,
  billingAddressParameters: {
    format: 'FULL',
    phoneNumberRequired: true
  }
});

Uji checkout tamu cepat: Amati halaman pengujian untuk memverifikasi bahwa tombol checkout tamu langsung di halaman detail produk mengumpulkan semua atribut yang diperlukan, sehingga tidak perlu memasukkan data secara manual:

9. Pembersihan

Hapus project Google Cloud

Agar tidak menimbulkan biaya pada Akun Google Cloud Anda untuk resource yang digunakan dalam codelab ini, sebaiknya hapus project Google Cloud tersebut.

gcloud projects delete $GOOGLE_CLOUD_PROJECT

10. Kesimpulan

Anda telah menyelesaikan workshop Google Pay API: Vibe-code checkout page with MCP servers and Antigravity.

Anda telah mempelajari cara menghubungkan server MCP Google Pay ke alat yang dibuat khusus untuk AI, membuat integrasi checkout yang bersih menggunakan Rekayasa Konteks, menerapkan alur kerja langganan dan harga dinamis menggunakan Pengembangan yang Didorong Spesifikasi, serta men-deploy pipeline pemantauan otonom berbasis LLM. Anda kini siap untuk mengodekan suasana checkout yang siap menghadapi masa depan dan alur kerja pemantauan berbasis AI.

Referensi lainnya

Bergabung dengan #google-dev-community channel di Discord
Ikuti @GooglePayDevs di X

Google Pay API: Melakukan vibe coding pada halaman checkout dengan server MCP dan Antigravity

1. Ringkasan

Yang akan Anda pelajari

2. Penyiapan dan persyaratan

Sebelum memulai

Peran yang diperlukan

Autentikasi dan otorisasi

3. Mengonfigurasi server MCP

Mengonfigurasi aplikasi AI Anda

Antigravity 2.0

Antigravity IDE

Alat AI lainnya

4. Menyiapkan integrasi Google Pay baru ke dalam checkout

Pemecahan masalah

5. Mengoptimalkan UX untuk biaya tambahan dinamis

Memahami nuansa cardFundingSource

Pengembangan berbasis spesifikasi untuk penetapan harga dinamis

6. [Opsional] Meningkatkan tingkat keberhasilan pembayaran untuk pembayaran berulang

Menerapkan pengembangan berbasis spesifikasi

Pemecahan masalah

7. [Opsional] Mengamankan konversi dengan pemantauan agentik jangka panjang

Membuat keterampilan agen Antigravitasi dan menjalankan sebagai tugas jangka panjang

8. [Opsional] Meningkatkan konversi dengan checkout tamu cepat GPay

Pengembangan berbasis spesifikasi untuk pembayaran tamu

9. Pembersihan

Hapus project Google Cloud

10. Kesimpulan

Referensi lainnya

Memahami nuansa `cardFundingSource`