Tujuan
Dokumen ini menjelaskan metode untuk menggabungkan Place Autocomplete, Address Validation API1, dan Maps di checkout e-commerce untuk tujuan mengambil alamat berkualitas tinggi.
Prasyarat
Google merekomendasikan agar Anda memahami hal berikut:
- Dokumentasi developer JavaScript Place Autocomplete.
- Pahami dari sudut pandang teknis cara kerja Place Autocomplete dan opsi penerapannya.
- Panduan penerapan checkout untuk Place
Autocomplete.
- Contoh praktik terbaik penerapan Place Autocomplete di checkout e-commerce.
- Dokumentasi produk Address Validation API,
dengan fokus pada Mem-build logika validasi.
- Pahami dari sudut pandang teknis cara kerja Address Validation API, dan tinjau sinyal yang menentukan kualitas alamat.
Apa yang dimaksud dengan validasi alamat?
Address Validation API adalah layanan yang menerima alamat. Fungsi ini mengidentifikasi komponen alamat dan memvalidasinya. File ini juga menstandarkan alamat untuk pengiriman surat dan menemukan koordinat lintang/bujur yang paling diketahui untuk alamat tersebut. Secara opsional, untuk alamat di Amerika Serikat dan Puerto Riko, Anda dapat mengaktifkan Coding Accuracy Support System (CASS™).Mengapa Anda memerlukan validasi alamat saat checkout?
Kumpulkan alamat yang akurat selama proses pemesanan:
Ini adalah langkah penting untuk mendorong keberhasilan pengiriman, meningkatkan pemenuhan pesanan tepat waktu, dan mengurangi biaya koreksi alamat yang mahal.
Membimbing pelanggan untuk memasukkan alamat dengan cepat dan akurat:
Place Autocomplete mempercepat entri alamat dan mengurangi error input, sehingga
pelanggan dapat melakukan checkout dengan mudah. Validasi Alamat memberikan masukan
tentang kualitas alamat secara keseluruhan, melakukan koreksi seperti standardisasi dan
kesalahan ejaan, serta meningkatkan metadata, seperti memberikan indikator perumahan atau
komersial (tersedia di wilayah
tertentu.
Ringkasan Penerapan
Bagian ini menguraikan alur kerja entri alamat yang direkomendasikan untuk checkout e-commerce. Proses ini terdiri dari tiga langkah:
- Gunakan Place Autocomplete untuk pertama kali mengambil alamat.
- Gunakan Address Validation API untuk mengonfirmasi alamat yang dimasukkan.
- Menampilkan lokasi alamat yang dimasukkan di peta, untuk memberikan kepastian pengiriman kepada pelanggan.
Selanjutnya, kita akan mempelajari setiap langkah secara terpisah.
Langkah 1: Alur entri alamat - menggunakan layanan Place Autocomplete
Terapkan Place Autocomplete menggunakan JavaScript API pada baris pertama formulir entri alamat.
Place Autocomplete memberikan saran kepada pelanggan saat mereka memasukkan detail alamat. Saat diterapkan menggunakan JavaScript API, saat pengguna mulai mengetik, menu drop-down akan muncul di bawah kolom formulir entri alamat, yang menampilkan hasil dari layanan Autocomplete yang diperbarui dengan setiap penekanan tombol. Setelah pengguna memasukkan informasi yang cukup untuk menemukan alamat, mereka akan memilihnya dari menu drop-down. Tindakan ini akan otomatis mengisi kolom formulir dengan data alamat.
Anda dapat memberikan dua gaya entri formulir kepada pengguna dengan Place Autocomplete: tampilan dengan semua kolom alamat, atau tampilan dengan satu kolom input. Kolom input tunggal ini meminta pengguna untuk mulai menelusuri saat mengetik, bukan memasukkan komponen alamat satu per satu. Setelah pelengkapan otomatis mengisi alamat, alur kerja akan memperluas kolom formulir dengan data alamat, sehingga pelanggan dapat meninjau dan melakukan pengeditan, misalnya menambahkan nomor apartemen atau unit.
Berikut adalah contoh tampilan alur ini, menggunakan satu kolom input:
Langkah 2: Gunakan Address Validation API untuk memvalidasi alamat
Setelah pengguna memasukkan alamat, Google merekomendasikan agar Anda memanggil Address Validation API saat checkout untuk mengonfirmasi bahwa alamat tersebut valid dan lengkap. Memicu panggilan ke Address Validation API setelah pengguna mengklik tombol Next atau Continue pada formulir alamat. Tombol ini sering kali mengarah ke halaman pembayaran.
Google merekomendasikan untuk memanggil Address Validation API untuk setiap transaksi.
Diagram alur berikut mengilustrasikan contoh integrasi menyeluruh Address Validation API dalam checkout:
Dokumen ini membahas skenario penerimaan alamat nanti.
Langkah 3: Berikan konfirmasi visual
Setelah entri alamat, berikan konfirmasi visual kepada pengguna terkait lokasi pengiriman dengan menampilkannya di peta. Hal ini memberikan kepastian tambahan kepada pelanggan bahwa alamat tersebut sudah benar, dan mengurangi kegagalan pengiriman atau pengambilan.
Peta dapat ditampilkan selama proses checkout, atau dikirim dalam email konfirmasi transaksi. Kedua kasus penggunaan ini dapat dilakukan dengan API berikut.
Maps JavaScript API menyediakan peta interaktif untuk menampilkan lokasi pengguna. | Maps Static API memungkinkan penyematan gambar dalam halaman web atau di tahap selanjutnya dalam email. |
---|---|
Pembahasan Mendalam - skenario penerimaan alamat
Respons Address Validation API dapat dikategorikan menjadi tiga skenario utama:
- Perbaiki—alamat berkualitas rendah. Anda harus meminta informasi lebih lanjut.
- Konfirmasi—alamat berkualitas tinggi, tetapi memiliki perubahan dari alamat input. Anda mungkin meminta konfirmasi.
- Terima—alamat berkualitas tinggi. Anda dapat menerima alamat yang diberikan.
Konsep ini dibahas di bagian Mem-build logika validasi dalam dokumen Address Validation API, dan kami akan membahas setiap skenario di bagian ini.
Perbaiki
Bagian ini menunjukkan cara memperbaiki input alamat. Untuk informasi tentang sinyal tertentu yang ditampilkan Address Validation API untuk menunjukkan alamat berkualitas rendah, lihat Memperbaiki alamat dalam dokumentasi Membuat logika validasi.
Jika respons dari Address Validation API menunjukkan alamat yang tidak valid, alihkan pelanggan ke formulir entri alamat untuk memeriksa data yang dimasukkan. Setelah alamat diperbaiki, layanan Anda harus mengirim ulang ke Address Validation API untuk memastikan bahwa koreksi yang dilakukan valid.
Anda juga dapat menandai error baris alamat tertentu menggunakan sinyal
yang ditampilkan di tingkat addressComponents
. Contohnya dapat dilihat di
screenshot di sebelah kanan.
Konfirmasi
Bagian ini menunjukkan cara mengonfirmasi alamat. Untuk informasi tentang sinyal tertentu yang ditampilkan Address Validation API untuk menunjukkan bahwa alamat harus dikonfirmasi, lihat Mengonfirmasi alamat dalam dokumentasi Membuat logika validasi.
Sering kali sistem Anda meminta pengguna untuk mengonfirmasi alamat. Misalnya, pelanggan salah mengeja nama kota, yang kemudian akan dikoreksi oleh Address Validation API. Anda harus mengonfirmasi perbaikan ini dengan pelanggan. Hal ini karena perubahan yang dilakukan oleh API secara mendasar dapat mengubah apa yang awalnya dimasukkan.
Gunakan modal interstisial untuk menampilkan informasi kepada pelanggan, yang memungkinkan tiga opsi untuk melanjutkan:
- Konfirmasi alamat seperti yang ditampilkan oleh API, dan proses checkout akan berlanjut, menggunakan alamat yang dikoreksi.
- Pilih alamat seperti yang dimasukkan awalnya, dengan mengabaikan koreksi dari Address Validation API. Proses checkout dapat dilanjutkan seperti biasa, dan pesanan dapat ditandai untuk peninjauan downstream sebelum pengiriman, jika proses Anda memungkinkan.
- Pelanggan membatalkan atau keluar dari modal, dan mengembalikannya ke tahap entri alamat pada proses checkout, tempat mereka dapat memasukkan kembali alamat tersebut dari awal, sehingga memulai proses dari awal.
Contohnya dapat dilihat pada screenshot di sebelah kanan.
Terima
Bagian ini menunjukkan cara menerima alamat. Untuk informasi tentang sinyal tertentu yang ditampilkan Address Validation API untuk menunjukkan bahwa alamat memiliki kualitas yang baik dan harus diterima, lihat Menerima alamat dalam dokumentasi Membuat logika validasi.
Dalam skenario ini, proses checkout akan beralih ke tahap berikutnya, kemungkinan penerimaan pembayaran, tanpa meminta pelanggan untuk memeriksa kualitas alamat. API telah mengonfirmasi bahwa alamat yang dimasukkan oleh pelanggan memiliki kualitas yang baik, dan dapat dikirim.
Sebaiknya gunakan data alamat yang ditampilkan dari Address Validation API untuk pesanan, karena data ini dapat berisi koreksi dan penambahan kecil, seperti berikut:
- Kapitalisasi
- Koreksi pemformatan, misalnya
- Jalan ke St
- Mengurutkan komponen alamat dengan benar
- ZIP+4 di Amerika Serikat.
Pertimbangan Penerapan
Saat membuat logika penerimaan alamat, pastikan penerapan Anda tidak memblokir pelanggan untuk check out karena memasukkan alamat yang tidak valid. Buat logika dengan cara yang mencegah kemungkinan loop tanpa batas jika API berulang kali menunjukkan entrinya tidak valid.
Google merekomendasikan agar Anda memberi pelanggan hingga dua kesempatan untuk memasukkan alamat mereka, dan pada percobaan kedua, terima entri mereka, meskipun tidak valid. Pada upaya kedua, tujuannya adalah membiarkan mereka melanjutkan terlepas dari validasi.
Dua metode yang disarankan untuk menerima upaya kedua:
- Teruskan paksa: Menampilkan modal kepada pelanggan yang menjelaskan bahwa alamat tidak valid, tetapi mengizinkan opsi untuk melanjutkan dengan alamat yang diketik.
- Penerimaan Senyap: Otomatis menyetujui upaya kedua tanpa langkah konfirmasi, meskipun alamat tidak sepenuhnya valid.
Jika memungkinkan, desain sistem Anda untuk menandai alamat yang tidak valid, sehingga perwakilan layanan pelanggan dapat meninjaunya sebelum pesanan dikirim. Tindakan tambahan ini memastikan Anda mendeteksi kesalahan.
Konstruksi bangunan baru memberikan ilustrasi yang baik tentang mengapa pemeriksaan ini direkomendasikan. Mungkin ada jeda antara saat konstruksi bangunan baru selesai dan saat alamat bangunan tersebut diisi dalam database alamat pos. Pelanggan harus memiliki opsi untuk melanjutkan paksa melalui halaman checkout dengan alamat yang mereka ketik, meskipun tidak memvalidasi.
Setelah sesi checkout selesai, secara opsional gunakan metode
provideValidationFeedback
untuk mengirim masukan ke Google tentang upaya validasi alamat tertentu.
Kesimpulan
Dokumen ini memberikan ringkasan alur checkout yang menerapkan Pelengkapan Otomatis, Validasi Alamat, dan konfirmasi visual pada Google Maps. Gunakan dokumen ini sebagai titik awal untuk mendesain implementasi Anda, dengan mengikuti alur entri alamat yang direkomendasikan.
Langkah Berikutnya
Download Whitepaper Meningkatkan checkout, pengiriman, dan operasi dengan alamat yang andal dan tonton Webinar Meningkatkan checkout, pengiriman, dan operasi dengan Validasi Alamat .
Bacaan lebih lanjut yang disarankan:
Kontributor
Henrik Valve | Solutions Engineer
Thomas Anglaret | Solutions Engineer
Sarthak Ganguly | Solutions Engineer
-
Pemegang Lisensi Non-eksklusif United States Postal Service. Merek dagang berikut dimiliki oleh United States Postal Service® dan digunakan dengan izin: CASS™, USPS®, DPV®. ↩