Daftar periksa integrasi
Ikuti daftar periksa komprehensif ini untuk menyiapkan akun Zonos Dashboard Anda dan mengintegrasikan Zonos Checkout ke situs atau platform kustom Anda.
Buat akun Zonos
Untuk memulai, silakan hubungi tim penjualan kami untuk membuat akun dan menandatangani perjanjian. Setelah perjanjian ditandatangani, Anda akan menerima dua setoran mikro di akun Anda yang perlu diverifikasi.
Silakan kirimkan jumlah setoran mikro ini melalui email ke accounting@zonos.com dengan ID toko Dashboard Anda (CC perwakilan penjualan Anda).
Setelah diverifikasi, detail perbankan Anda akan ditampilkan di Dashboard -> Settings -> Billing.
Konfigurasi Dashboard dan pengaturan Checkout
Setelah membuat akun Zonos Anda, Anda perlu mengkonfigurasi pengaturan di Dashboard untuk memastikan Checkout berfungsi dengan baik dengan toko Anda. Bagian ini mencakup semua konfigurasi Dashboard yang penting.
Siapkan pembayaran
Hubungkan rekening bank untuk menerima pembayaran tepat waktu dari Checkout. Pembayaran diproses setiap hari dalam penundaan 2 hari dari pembayaran yang ditangkap. Untuk melakukan ini, silakan ikuti langkah-langkah berikut:
- Navigasi ke Dashboard -> Settings -> Checkout settings .
- Klik Add bank account
- Anda akan dibawa ke portal Stripe untuk menyelesaikan pengaturan dan memberikan informasi berikut:
- Informasi rekening bank.
- EIN Perusahaan.
- Nomor Jaminan Sosial pemilik perusahaan 25%. Untuk detail lebih lanjut tentang mengapa ini diperlukan, lihat dokumentasi Stripe.
Catatan: Jika Anda perlu memperbarui jadwal pembayaran Anda, silakan hubungi support@zonos.com
Siapkan domain yang diizinkan
Skrip Zonos JS memerlukan daftar domain yang diizinkan untuk tujuan keamanan. Ini mencegah situs yang tidak sah memuat skrip dan memastikan hanya berjalan di domain yang disetujui Anda. Tanpa konfigurasi ini, skrip akan mengembalikan kesalahan izin.
Untuk menyiapkan ini:
- Navigasi ke Dashboard -> Settings -> Checkout settings
- Di bawah URLs, tambahkan domain lengkap Anda dan subdomain apa pun tempat Checkout akan digunakan. Misalnya, jika domain Anda adalah
example.com, Anda harus menambahkanexample.comdantest.example.com.
Sesuaikan pengaturan branding
Konfigurasi pengaturan branding Anda di Dashboard untuk mencocokkan tampilan dan nuansa toko Anda.
Untuk melakukan ini, silakan ikuti langkah-langkah berikut:
- Navigasi ke Dashboard -> Settings -> Checkout settings -> Branding
- Konfigurasi pengaturan berikut:
- Logo.
- Brand dan warna aksen.
- Tema, Gaya, dan Font.
Untuk informasi lebih lanjut tentang pengaturan branding, lihat dokumentasi kami.
Hubungkan penyedia pengiriman
Untuk memberikan penawaran pengiriman saat checkout, Anda perlu menghubungkan penyedia pengiriman ke akun Zonos Anda. Ini akan memungkinkan Anda mengaktifkan tingkat layanan pengiriman tertentu saat checkout.
Untuk menghubungkan penyedia pengiriman, silakan ikuti langkah-langkah berikut:
- Navigasi ke Dashboard -> Settings -> Shipping -> Rates
- Klik Add carrier
- Ikuti instruksi pengaturan penyedia.
Untuk detail lebih lanjut tentang menghubungkan akun penyedia, lihat dokumentasi kami.
Siapkan zona pengiriman
Zona pengiriman memungkinkan Anda mengkonfigurasi penyedia pengiriman dan tingkat layanan mana yang tersedia untuk berbagai wilayah dunia.
Untuk menyiapkan zona pengiriman, silakan ikuti langkah-langkah berikut:
- Navigasi ke Dashboard -> Settings -> Shipping -> Locations
- Klik New zone
- Masukkan nama zona dan pilih negara yang ingin Anda kirim.
- Pilih penyedia dan tingkat layanan yang ingin Anda tawarkan.
Untuk detail lebih lanjut tentang zona pengiriman, lihat dokumentasi kami.
Siapkan fallback negara asal dan kode HS
Negara asal dan kode HS digunakan untuk menghitung bea dan pajak yang akurat.
Jika Anda tidak memberikan negara asal atau kode HS tertentu, kami akan menggunakan fallback yang disiapkan di Dashboard.
Untuk menetapkan fallback Negara Asal dan kode HS Anda:
- Navigasi ke Dashboard -> Settings -> Shipping -> Catalog.
- Untuk negara asal, pilih negara tempat sebagian besar produk Anda diproduksi.
- Untuk kode HS, masukkan kode HS produk Anda yang paling umum. Jika Anda tidak memiliki kode HS, navigasi ke Classify di Dashboard dan masukkan nama dan deskripsi produk Anda untuk membuat kode HS yang akurat.
Pasang snippet Zonos JS
Snippet Zonos JS adalah integrasi JavaScript sisi klien yang memungkinkan fungsionalitas checkout global di situs Anda. Ini berfungsi sebagai jembatan antara platform e-commerce Anda dan layanan Zonos, menangani:
- Pengalaman Checkout: Merender UI checkout dan memproses pembayaran.
- Layanan Lokasi: Mendeteksi lokasi pengunjung dan mengelola konversi mata uang.
- Integrasi Keranjang: Terhubung dengan sistem keranjang dan pesanan Anda yang ada.
- Keamanan: Memvalidasi domain dan mengautentikasi permintaan API.
Snippet dimuat secara asinkron untuk mencegah dampak apa pun pada kinerja situs Anda. Ini menginisialisasi dengan kredensial API toko Anda dan menangani semua interaksi sisi klien dengan aman. Implementasi dirancang agar tidak mengganggu, memerlukan perubahan minimal pada alur checkout yang ada.
Di bawah ini adalah contoh lengkap yang mencakup pemuatan skrip, inisialisasi, dan penanganan peristiwa untuk direferensikan saat mengintegrasikan Checkout.
(async function () { const timestamp = new Date().getTime(); const zonosScript = document.querySelector( `script[src*="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/loadZonos.js"]`, ); if (!zonosScript) { const script = document.createElement("script"); script.src = `https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/loadZonos.js?timestamp=${timestamp}`; script.addEventListener("load", () => { window.Zonos.init({ : { : () => { { : , }; }, : , }, : { : , : { .(); }, }, : , : , }); }); ..(script); } })();Catatan: Ganti nilai placeholder (storeId, zonosApiKey, selector, dll.) dengan nilai aktual Anda dari Zonos Dashboard.
Menangani caching browser
Kami merekomendasikan menambahkan stempel waktu atau pengidentifikasi unik lainnya ke URL untuk memastikan bahwa skrip tidak disimpan dalam cache oleh browser. Ini akan memastikan bahwa versi terbaru dari skrip selalu dimuat. Ini ditunjukkan pada baris 10 contoh lengkap.
script.src = `https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/loadZonos.js?timestamp=${timestamp}`;Autentikasi snippet Zonos JS
Setelah memuat skrip Zonos JS, Anda perlu mengautentikasinya dengan melewatkan kunci API Zonos publik dan ID toko ke dalam fungsi Zonos.init. Kunci API publik yang digunakan untuk mengautentikasi Checkout dirancang untuk dapat dipublikasikan, yang berarti dapat digunakan dengan aman dalam kode frontend tanpa mengekspos informasi sensitif apa pun.
Untuk menemukan ID toko dan kunci API Anda, navigasi ke Dashboard -> Settings -> Integrations. Pastikan Anda tidak menggunakan Kunci API Rahasia, karena tidak dirancang untuk digunakan dalam kode frontend. Ini ditunjukkan pada baris 29 dan 30 contoh lengkap.
Zonos.init({ // ... other fields zonosApiKey: "Your API KEY", // Replace with your actual API key (found in Dashboard) storeId: "Your STORE ID", // Replace with your actual store ID (found in Dashboard) // ... other fields});Perbarui Content Security Policy (CSP) Anda
Jika situs Anda menetapkan Content Security Policy, tambahkan domain di bawah ke direktif CSP yang sesuai. Kebijakan ini berlaku untuk Checkout dan Hello - snippet Zonos memuat skrip, stylesheet, font, gambar, dan membuat permintaan jaringan, jadi memblokir salah satu sumber daya ini akan mengganggu alur Checkout atau tampilan Hello. Daftar style-src juga berlaku untuk style-src-elem.
Catatan: Lewati langkah ini jika situs Anda tidak mengirimkan header CSP. Hanya pedagang yang memberlakukan CSP kustom di halaman mereka yang perlu memperbaruinya.
cdn.jsdelivr.net/npm/@zonoscdnjs.cloudflare.com/ajax/libs/zonos-elementsunpkg.com/@zonos/elementsjs.zonos.com*.js.zonos.comzonos-store-assets.s3.amazonaws.comjs.stripe.coma.stripecdn.comb.stripecdn.comc.stripecdn.comcheckout.stripe.comf.stripecdn.comhcaptcha.comhooks.stripe.comm.stripe.comm.stripe.networkpay.stripe.compayments.stripe.comq.stripe.comr.stripe.comSiapkan Hello
Hello diperlukan saat menggunakan Checkout.
Hello bertanggung jawab untuk mendeteksi lokasi, bahasa, dan mata uang pengunjung, serta menampilkan informasi yang sesuai kepada mereka. Anda dapat mengkonfigurasi semua pengaturan Hello di Dashboard atau dalam skrip Zonos JS. Jika Anda sudah mengkonfigurasi Hello di Dashboard, skrip akan memuat pengaturan tersebut dan menggunakannya. Jika Anda menentukan nilai apa pun dalam properti helloSettings fungsi Zonos.init, skrip akan menggunakan nilai tersebut sebagai gantinya seperti yang ditunjukkan di bawah.
Konfigurasi konversi mata uang di Hello dalam Skrip JS
Hello menggunakan pemilih CSS untuk mengidentifikasi elemen di situs Anda yang menampilkan informasi mata uang. Berikan pemilih ini ke properti helloSettings.currencyElementSelector fungsi Zonos.init sehingga Hello dapat mendeteksi dan menampilkan mata uang yang benar dari pembeli internasional.
Anda dapat menggunakan pemilih CSS apa pun yang valid di sini, misalnya #price, .price untuk memilih beberapa elemen berbeda. Ini ditunjukkan pada baris 23 dan 24 contoh lengkap.
Zonos.init({ // ... other fields helloSettings: { currencyElementSelector: ".price", // Replace with your actual selector }, // ... other fields});Buka Hello secara otomatis saat memuat halaman
Secara default, Hello hanya akan dibuka saat pengunjung mengklik tombol bendera. Jika Anda ingin membuka Hello secara otomatis saat halaman dimuat, Anda dapat memanggil fungsi Zonos.openHelloDialog() setelah skrip Zonos dimuat. Ini ditunjukkan pada baris 25 dan 26 contoh lengkap.
Zonos.({ : { : { .(); }, },});Konfigurasi aturan tampilan negara di Dashboard
Kontrol negara pembeli mana yang melihat Hello dan negara mana yang muncul di dropdown pemilih negara dari Dashboard. Navigasi ke Dashboard -> Settings -> Hello dan temukan bagian Country display rules.
Visibilitas widget
Kontrol negara pembeli mana yang melihat widget Hello. Pilih salah satu aturan dasar, kemudian gunakan daftar Always show dan Never show untuk mengganti negara tertentu.
- All countries - Setiap negara yang didukung Hello.
- Only shippable countries - Negara yang Anda kirim dari pengaturan pengiriman Anda.
- Always show - Negara yang selalu muncul, bahkan jika aturan dasar mengecualikannya.
- Never show - Negara yang tidak pernah muncul, bahkan jika aturan dasar memasukkannya.

Pemilih negara
Kontrol negara mana yang muncul di dropdown pemilih negara Hello, menggunakan aturan dasar yang sama ditambah pembatalan Always show dan Never show.

Siapkan Checkout
Checkout bertanggung jawab untuk memungkinkan pelanggan memasukkan informasi pengiriman dan penagihan mereka, menghitung landed cost, mengumpulkan pembayaran, dan menyelesaikan pesanan.
Checkout akan membagikan data kontekstual dengan Hello, seperti lokasi, bahasa, dan mata uang pengunjung. Ini memastikan pengalaman pelanggan konsisten di seluruh proses berbelanja.
Anda dapat mengkonfigurasi semua pengaturan Checkout baik di Dashboard maupun skrip Zonos JS. Jika Anda sudah mengkonfigurasi Checkout di Dashboard, skrip akan memuat pengaturan tersebut dan menggunakannya. Jika Anda menentukan nilai apa pun dalam properti checkoutSettings fungsi Zonos.init, skrip akan menggunakan nilai tersebut sebagai gantinya.
Konfigurasi tombol 'place order' dalam Skrip JS
Skrip Zonos JS akan secara otomatis mengenali pembeli internasional dan mengarahkan mereka ke alur Checkout. Namun, Anda perlu mengkonfigurasi tombol 'place order' di platform Anda untuk membuka Checkout saat diklik. Ini dapat dilakukan dengan melewatkan pemilih CSS ke properti checkoutSettings.placeOrderButtonSelector fungsi Zonos.init.
Jika Anda memiliki beberapa tombol yang dapat digunakan untuk melakukan pesanan, pastikan untuk melewatkan pemilih untuk setiap tombol. Misalnya, #placeOrder, .place-order.
Ini ditunjukkan pada baris 21 contoh lengkap.
Zonos.init({ // ... other fields checkoutSettings: { // ... other fields placeOrderButtonSelector: "#placeOrder", // Replace with your actual selector(s) },});Buat detail keranjang dengan aman di sisi server
Untuk menampilkan detail keranjang kepada pelanggan, Anda perlu membuat fungsi sisi server yang akan memanggil API Zonos untuk membuat keranjang, kemudian meneruskan ID keranjang itu kembali ke frontend Anda. Ini akan memastikan bahwa detail keranjang tidak terpapar kepada pelanggan dengan cara yang dapat dimanipulasi.
Panggilan API backend Anda akan menggunakan token kredensial GraphQL rahasia, yang berbeda dari token publik yang Anda gunakan untuk mengautentikasi skrip Zonos JS. Token ini dapat diambil di Dashboard -> Settings -> Integrations. Token rahasia perlu dilewatkan sebagai header dalam panggilan API Anda.
Mutasi cartCreate menerima daftar item, yang harus diformat sesuai dengan skema item keranjang.
// Create new cart from serversideasync function createCart() { /** * Full cart mutation schema: https://zonos.com/developer/mutations/cartCreate * */ const graphql = JSON.stringify({ query: `mutation cartCreate($input: CartCreateInput!){ cartCreate(input: $input) { id adjustments { amount currencyCode description productId sku type } items { id name amount currencyCode quantity sku description metadata { key value } } metadata { key value } }}`, variables: { /** * input for the cartCreate is this schema https://zonos.com/developer/types/CartCreateInput */ input: { /** * Cart adjustment input: https://zonos.com/developer/types/CartAdjustmentInput */ adjustments: [ { amount: -10, currencyCode: "USD", /** * Enum value: https://zonos.com/developer/types/CartAdjustmentType */ type: "CART_TOTAL", }, ], /** * Cart item input: https://zonos.com/developer/types/ItemInput */ items: [ { name: "Item 1", amount: 150.99, currencyCode: "USD", description: "Item 1 description", quantity: 2, }, ], /** * Cart metadata input: https://zonos.com/developer/types/CartMetadataInput */ metadata: [ { : , : , }, ], }, }, }); response = (, { : , : { : , : , }, : graphql, }); { data } = response.(); data..; }Kami menyarankan membuat endpoint API di sisi server Anda dan kemudian memanggil endpoint tersebut dari integrasi JS frontend Anda, yang dijelaskan pada langkah berikutnya.
Berikan ID Keranjang ke Checkout melalui frontend
Setelah Anda membuat keranjang di sisi server Anda, Anda perlu meneruskan ID keranjang ke skrip Zonos JS. Ini dapat dilakukan dengan menggunakan callback createCartId yang merupakan bagian dari fungsi Zonos.init. Checkout kemudian akan dengan aman mengambil detail keranjang dari Zonos saat dibuka, mencegah penggantian keranjang apa pun. Lihat contoh kode di bawah.
Nilai createCartId tidak dapat berupa nilai statis, harus berupa fungsi.
Zonos.init({ // ... other fields checkoutSettings: { // Replace with your actual selector(s) createCartId: async () => { const response = await fetch("https://api.merchant.com/api/get-cart", { method: "POST", headers: { "Content-Type": "application/json", }, }); const json = await response.json(); return json.id; // Only need to return the cart ID }, },});(Opsional) Tampilkan pemberitahuan di bawah Order total
Jika Anda perlu menampilkan pesan singkat dan dinamis di dalam Checkout - misalnya, pengungkapan peraturan saat produk tertentu ada di keranjang - Anda dapat mengembalikan array customMessage dari callback createCartId. Setiap entri dalam array ditampilkan pada baris sendiri dari spanduk info tunggal langsung di bawah Order total.
Sintaks tautan Markdown — [label tautan] diikuti oleh (https://example.com) — dirender sebagai tag jangkar, sehingga pembeli dapat mengklik. URL biasa https:// dalam teks juga secara otomatis ditautkan. Selain itu, semuanya dirender sebagai teks biasa, sehingga HTML dalam string akan di-escape, bukan dijalankan.
Hanya satu spanduk yang ditampilkan per Checkout, tidak peduli berapa banyak baris yang Anda lewatkan.
Zonos.init({ // ... other fields checkoutSettings: { createCartId: async () => { const response = await fetch( "https://api.merchant.com/api/get-zonos-cart", { method: "POST", headers: { "Content-Type": "application/json", }, }, ); const json = await response.json(); return { cartId: json.id, // Each item is rendered on a new line of the same info banner. // Markdown links `[text](url)` become `<a>` tags. customMessage: [ "Some items in your cart are subject to California regulations.", "Please review the required notice [here](https://oag.ca.gov/prop65).", ], }; }, },});Catatan: Teks pesan dirender sebagai teks biasa — tag HTML dalam string akan di-escape, jadi hanya sintaks tautan Markdown yang ditafsirkan. Tentukan apakah akan menyertakan
customMessagedi sisi server berdasarkan isi keranjang sehingga spanduk hanya muncul saat relevan.
(Opsional) Pemicu checkout Zonos secara terprogram
Jika Anda memiliki logika kustom dan perlu memicu checkout Zonos secara terprogram, Anda dapat menggunakan fungsi Zonos.triggerCheckoutInternational() untuk membuka jendela checkout Zonos setelah Zonos diinisialisasi. Ini akan menjalankan callback createCartId yang ditentukan di Zonos.init di atas dan membuka jendela checkout Zonos.
// For example: During your domestic checkout flow, trigger Zonos checkout when the user selects a non-domestic country (e.g., not "US")const domesticCountry = "US";document.querySelector(".country-select").addEventListener("change", e => { const country = e.target.value; if (country !== domesticCountry) { Zonos.triggerCheckoutInternational(); }});(Opsional) Selalu pemicu pemilih checkout Zonos
Jika Anda ingin memisahkan proses checkout untuk pembeli domestik dan internasional, Anda dapat menambahkan tombol International checkout ke situs Anda. Alih-alih memicu Zonos Checkout secara manual dengan Zonos.triggerCheckoutInternational, Anda dapat mengkonfigurasi Zonos.init dengan pemilih yang sesuai. Pemilih akan dinonaktifkan sampai Zonos diinisialisasi, saat tombol diklik, itu akan secara otomatis memicu checkout Zonos. Ini akan menjalankan callback createCartId yang ditentukan di Zonos.init dan membuka jendela checkout Zonos.
Zonos.init({ // ... other fields checkoutSettings: { // ... other fields alwaysTriggerInternationalCheckoutSelector: "#trigger-zonos-checkout", // Replace with your actual selector, button bound to this selector will always trigger Zonos checkout },});(Opsional) Lacak corong checkout dengan GA4 atau Facebook Pixel
Zonos Checkout dapat meneruskan corong checkout lengkap ke alat analitik Anda yang ada. Untuk setiap langkah, Zonos memancarkan:
- Peristiwa asli
zonos-checkout-...ke GA4 (melaluigtag('event', ...)) dan ke Meta sebagai peristiwa kustom (melaluifbq('trackCustom', ...)). - Peristiwa standar yang cocok ke Meta saat ada —
InitiateCheckout,AddPaymentInfo, danPurchase— sehingga pengoptimalan bawaan Meta dan pelaporan konversi berfungsi langsung.
Cara peristiwa sampai ke penyedia Anda bergantung pada cara Checkout dirender di situs Anda. Pilih jalur yang sesuai dengan integrasi Anda.
Integrasi asli (Checkout dirender langsung di situs Anda)
Ketika elemen kustom <zonos-checkout> dipasang di halaman Anda sendiri (default untuk integrasi skrip Zonos JS yang dijelaskan di atas), window.gtag dan window.fbq halaman sudah dalam cakupan. Zonos memanggil mereka secara langsung — tidak ada relay atau penyerahan ID piksel yang diperlukan.
Pengaturan:
- Pastikan halaman Anda sudah memiliki tag dasar GA4 dan/atau kode dasar Meta Pixel dimuat (dengan cara yang sama Anda akan melacak halaman lain di situs Anda).
- Aktifkan penyedia yang Anda inginkan di dasbor Zonos di bawah Checkout settings → Tracking (Google Analytics, Facebook Pixel, atau keduanya).
Itu saja. Tidak ada skrip relay, tidak ada customHTML, tidak ada ID tambahan untuk dilewatkan — Zonos mendeteksi gtag / fbq di halaman dan memancarkan peristiwa secara langsung.
Integrasi Iframe (Checkout iframe warisan di iglobalstores.com)
Ketika Checkout dihosting di iframe di asal yang berbeda, tidak dapat mencapai gtag / fbq halaman Anda secara langsung. Zonos menerbitkan skrip relay kecil — analyticsRelayOnInit.js — yang mendengarkan peristiwa postMessage dari iframe Checkout dan meneruskannya ke penyedia mana pun yang Anda miliki di halaman Anda. Satu relay menangani GA4 dan Facebook Pixel pada saat yang sama.
Pengaturan:
- Aktifkan penyedia yang Anda inginkan di dasbor Zonos di bawah Checkout settings → Tracking.
- Tambahkan tag dasar GA4 dan/atau kode dasar Meta Pixel ke
<head>halaman yang menghosting iframe Checkout. - Tambahkan skrip relay setelah tag penyedia:
async src="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js">- Lewatkan ID yang sesuai melalui
customHTMLCheckout Anda sehingga relay tahu properti/piksel mana yang akan dipecat:
window.Zonos.googleAnalyticId = "G-XXXXXXXXXX"; window.Zonos.facebookPixelId = "YOUR_PIXEL_ID";Untuk instruksi iframe langkah demi langkah, referensi peristiwa lengkap (termasuk pemetaan muatan purchase / Purchase), dan tip debug, lihat:
Sinkronkan pelacakan pesanan dan status ke Dashboard
Untuk mensinkronkan pesanan antara sistem Anda dan Zonos Dashboard, terapkan panggilan API dan webhook ini:
Mutasi yang Diperlukan
| Mutasi↕ | Deskripsi↕ |
|---|---|
orderUpdateAccountOrderNumber | Menyinkronkan nomor akun asli Anda dengan Dashboard. Docs → |
orderAddTrackingNumber | Diperlukan hanya jika Anda tidak mencetak label di Dashboard. Memastikan pelacakan muncul di Dashboard sehingga Zonos dapat menjamin perhitungan biaya pendaratan Anda. Docs → |
Webhook yang Diperlukan
Uji integrasi Anda
Sebelum go live dengan integrasi Checkout Anda, penting untuk menguji secara menyeluruh semua aspek integrasi untuk memastikan pengalaman pelanggan yang lancar. Ini termasuk menguji alur checkout, pemrosesan pembayaran, pembuatan pesanan, dan fungsionalitas webhook.
Ikuti panduan pengujian kami untuk memverifikasi bahwa integrasi Anda berfungsi dengan benar dan untuk mengidentifikasi dan memperbaiki masalah apa pun sebelum meluncurkan ke produksi.
Pertanyaan umum
Di bawah ini adalah beberapa pertanyaan umum tentang proses integrasi.
Bagaimana Zonos menangani konfirmasi pesanan?
Konfigurasi pengalaman pasca-pembelian di Dashboard -> Settings -> Checkout settings di bawah Success page type. Tiga opsi tersedia:
- Show Zonos success page (default, recommended) — Zonos menampilkan halaman terima kasih bawaan setelah pesanan ditempatkan. Halaman selalu ditampilkan, bahkan jika pesanan gagal diimpor ke sistem Anda, sehingga pembeli selalu mendapat konfirmasi.
- Redirect to a success page — Zonos menunggu di layar "Order complete" singkat sampai pesanan dibuat, kemudian mengalihkan ke URL kesuksesan Anda yang dikonfigurasi dengan
zOrderNumber(danorderIduntuk keranjang warisan) ditambahkan sebagai parameter kueri. - Close the checkout modal — Zonos menutup modal setelah pembayaran ditangkap. Jika Anda juga mengkonfigurasi URL kesuksesan, Zonos mengalihkan ke URL tersebut segera setelah Stripe mengumpulkan pembayaran — tanpa menunggu pesanan dibuat — dan menambahkan
zonosCheckoutSessionIdsebagai parameter kueri. Gunakan opsi ini saat Anda menginginkan serah terima tercepat kembali ke halaman kesuksesan Anda sendiri.
Mencari pesanan dari zonosCheckoutSessionId
Saat Anda menggunakan Close the checkout modal dengan URL pengalihan, pesanan mungkin memerlukan beberapa detik untuk terpasang ke sesi checkout setelah pengalihan. Baca zonosCheckoutSessionId dari URL dan lakukan polling terhadap kueri GraphQL checkoutSession dari server Anda menggunakan token kredensial rahasia Anda sampai pesanan siap. Jangan pernah panggil ini dari browser — token kredensial rahasia harus tetap di sisi server.
query getCheckoutSession($id: String!) { checkoutSession ) order idKirimkan kueri ke https://api.zonos.com/graphql dengan token kredensial rahasia Anda dari Dashboard -> Settings -> Integrations dilewatkan sebagai header permintaan credentialToken.
Bisakah saya diberi tahu saat pesanan dibuat?
Ya. Jika Anda ingin menerima notifikasi saat pesanan dibuat, di Dashboard di bagian Email dari Checkout settings, Anda dapat memasukkan alamat email anggota tim yang harus diberitahu saat pesanan dibuat, dikirim, atau dibatalkan.
Integrasi kustom
Bangun integrasi Checkout end-to-end ke situs kustom Anda.