1. Pengantar
Terakhir diperbarui: 11-07-2023
Menambahkan pembelian dalam aplikasi ke aplikasi Flutter memerlukan penyiapan App dan Play Store dengan benar, memverifikasi pembelian, dan memberikan izin yang diperlukan, seperti keuntungan langganan.
Dalam codelab ini, Anda akan menambahkan tiga jenis pembelian dalam aplikasi ke aplikasi (disediakan untuk Anda), dan memverifikasi pembelian ini menggunakan backend Dart dengan Firebase. Aplikasi yang disediakan, Dash Clicker, berisi game yang menggunakan maskot Dash sebagai mata uang. Anda akan menambahkan opsi pembelian berikut:
- Opsi pembelian berulang untuk 2000 Dash sekaligus.
- Pembelian upgrade satu kali untuk mengubah Dash gaya lama menjadi Dash gaya modern.
- Langganan yang menggandakan klik yang dihasilkan secara otomatis.
Opsi pembelian pertama memberi pengguna manfaat langsung sebesar 2000 Dash. Ini tersedia langsung untuk pengguna dan dapat dibeli berkali-kali. Produk ini disebut habis pakai karena langsung digunakan dan dapat dipakai beberapa kali.
Opsi kedua mengupgrade Dash ke Dash yang lebih indah. Paket ini hanya perlu dibeli sekali dan tersedia selamanya. Pembelian semacam ini disebut tidak habis pakai karena tidak dapat dipakai oleh aplikasi, tetapi berlaku selamanya.
Opsi pembelian ketiga dan terakhir adalah langganan. Saat langganan aktif, pengguna akan mendapatkan Dash lebih cepat, tetapi ketika dia berhenti membayar langganan, manfaatnya juga akan hilang.
Layanan backend (juga disediakan untuk Anda) berjalan sebagai aplikasi Dart, memverifikasi bahwa pembelian telah dilakukan, dan menyimpannya menggunakan Firestore. Firestore digunakan untuk mempermudah prosesnya, tetapi dalam aplikasi produksi, Anda dapat menggunakan jenis layanan backend apa pun.
Yang akan Anda build
- Anda akan memperluas aplikasi untuk mendukung pembelian dan langganan habis pakai.
- Anda juga akan memperluas aplikasi backend Dart untuk memverifikasi dan menyimpan item yang dibeli.
Yang akan Anda pelajari
- Cara mengonfigurasi App Store dan Play Store dengan produk yang dapat dibeli.
- Cara berkomunikasi dengan toko untuk memverifikasi pembelian dan menyimpannya di Firestore.
- Cara mengelola pembelian di aplikasi Anda.
Yang Anda butuhkan
- Android Studio 4.1 atau yang lebih baru
- Xcode versi 12 atau yang lebih baru (untuk pengembangan iOS)
- Flutter SDK
2. Menyiapkan lingkungan pengembangan
Untuk memulai codelab ini, download kode dan ubah ID paket untuk iOS serta nama paket untuk Android.
Mendownload kode
Untuk meng-clone repositori GitHub dari command line, gunakan perintah berikut:
git clone https://github.com/flutter/codelabs.git flutter-codelabs
Atau, jika Anda telah menginstal alat cli GitHub, gunakan perintah berikut:
gh repo clone flutter/codelabs flutter-codelabs
Kode contoh di-clone ke direktori flutter-codelabs yang berisi kode untuk sekumpulan codelab. Kode untuk codelab ini ada di flutter-codelabs/in_app_purchases.
Struktur direktori pada flutter-codelabs/in_app_purchases berisi serangkaian snapshot tempat Anda seharusnya berada di akhir setiap langkah yang diberi nama. Kode awal ada di langkah 0, jadi menemukan file yang cocok semudah:
cd flutter-codelabs/in_app_purchases/step_00
Jika Anda ingin melewati atau melihat tampilan yang seharusnya setelah satu langkah, lihat direktori yang dinamai berdasarkan langkah yang Anda minati. Kode langkah terakhir berada di folder complete.
Menyiapkan project awal
Buka project awal dari step_00 di IDE favorit Anda. Kami menggunakan Android Studio untuk screenshot, tetapi Visual Studio Code juga merupakan opsi yang bagus. Dengan salah satu editor, pastikan plugin Dart dan Flutter terbaru sudah diinstal.
Aplikasi yang akan Anda buat perlu berkomunikasi dengan App Store dan Play Store untuk mengetahui produk mana yang tersedia dan harganya. Setiap aplikasi diidentifikasi oleh ID unik. Untuk App Store iOS, hal ini disebut ID paket dan untuk Android Play Store, ini adalah ID aplikasi. ID ini biasanya dibuat menggunakan notasi nama domain terbalik. Misalnya saat membuat aplikasi pembelian dalam aplikasi untuk flutter.dev, kita akan menggunakan dev.flutter.inapppurchase. Pikirkan ID untuk aplikasi Anda, sekarang Anda akan menetapkannya di setelan project.
Pertama, siapkan ID paket untuk iOS.
Saat project terbuka di Android Studio, klik kanan folder iOS, klik Flutter, lalu buka modul di aplikasi Xcode.
Dalam struktur folder Xcode, project Runner berada di bagian atas, dan target Flutter, Runner, dan Products berada di bawah project Runner. Klik dua kali Runner untuk mengedit setelan project, lalu klik Penandatanganan & Kapabilitas. Masukkan ID paket yang baru saja dipilih pada kolom Team untuk menetapkan tim Anda.
Sekarang Anda dapat menutup Xcode dan kembali ke Android Studio untuk menyelesaikan konfigurasi Android. Untuk melakukannya, buka file build.gradle di android/app, dan ubah applicationId (di baris 37 pada screenshot di bawah) ke ID aplikasi, sama dengan ID paket iOS. Perlu diperhatikan bahwa ID untuk toko iOS dan Android tidak harus sama, tetapi tetap mempertahankannya agar tidak terlalu rentan mengalami error. Oleh karena itu, dalam codelab ini kita juga akan menggunakan ID yang identik.
3. Menginstal plugin
Di bagian codelab ini, Anda akan menginstal plugin in_app_purchase.
Menambahkan dependensi di pubspec
Tambahkan in_app_purchase ke pubspec dengan menambahkan in_app_purchase ke dependensi dalam pubspec Anda:
$ cd app $ flutter pub add in_app_purchase
pubspec.yaml
dependencies:
..
cloud_firestore: ^4.0.3
firebase_auth: ^4.2.2
firebase_core: ^2.5.0
google_sign_in: ^6.0.1
http: ^0.13.4
in_app_purchase: ^3.0.1
intl: ^0.18.0
provider: ^6.0.2
..
Klik pub get untuk mendownload paket atau menjalankan flutter pub get di command line.
4. Menyiapkan App Store
Untuk menyiapkan pembelian dalam aplikasi dan mengujinya di iOS, Anda harus membuat aplikasi baru di App Store dan membuat produk yang dapat dibeli di sana. Anda tidak perlu memublikasikan apa pun atau mengirim aplikasi ke Apple untuk ditinjau. Anda memerlukan akun developer untuk melakukannya. Jika belum memilikinya, daftarkan diri Anda ke program Apple Developer.
Perjanjian Aplikasi Berbayar
Untuk menggunakan pembelian dalam aplikasi, Anda juga harus memiliki perjanjian aktif untuk aplikasi berbayar di App Store Connect. Buka https://appstoreconnect.apple.com/, lalu klik Perjanjian, Pajak, dan Perbankan.
Anda akan melihat perjanjian di sini untuk aplikasi gratis dan berbayar. Status aplikasi gratis harus aktif, dan status untuk aplikasi berbayar masih baru. Pastikan Anda melihat persyaratan, menyetujuinya, dan memasukkan semua informasi yang diperlukan.
Jika semuanya diatur dengan benar, status untuk aplikasi berbayar akan menjadi aktif. Hal ini sangat penting karena Anda tidak akan dapat mencoba pembelian dalam aplikasi tanpa perjanjian aktif.
Mendaftarkan ID Aplikasi
Buat ID baru di portal Apple Developer.
Pilih ID Aplikasi
Pilih Aplikasi
Berikan beberapa deskripsi dan atur ID paket untuk mencocokkan ID paket dengan nilai yang sama seperti yang sebelumnya ditetapkan di XCode.
Untuk panduan selengkapnya tentang cara membuat ID aplikasi baru, lihat Bantuan Akun Developer .
Membuat aplikasi baru
Buat aplikasi baru di App Store Connect dengan ID paket unik Anda.
Untuk panduan selengkapnya tentang cara membuat aplikasi baru dan mengelola perjanjian, lihat Bantuan App Store Connect.
Untuk menguji pembelian dalam aplikasi, Anda memerlukan pengguna uji sandbox. Pengguna uji coba ini tidak boleh terhubung ke iTunes karena hanya digunakan untuk menguji pembelian dalam aplikasi. Anda tidak dapat menggunakan alamat email yang sudah digunakan untuk akun Apple. Di bagian Users and Access, buka Testers di bagian Sandbox untuk membuat akun sandbox baru atau mengelola ID Apple sandbox yang sudah ada.
Sekarang Anda dapat mengatur pengguna {i>sandbox <i}Anda pada iPhone dengan membuka Pengaturan > App Store > Akun sandbox.
Mengonfigurasi pembelian dalam aplikasi
Sekarang Anda akan mengonfigurasi tiga item yang dapat dibeli:
dash_consumable_2k: Pembelian habis pakai yang dapat dibeli berkali-kali, yang memberi pengguna 2000 Dash (mata uang dalam aplikasi) per pembelian.dash_upgrade_3d: "Upgrade" yang tidak habis pakai pembelian yang hanya bisa dibeli sekali, dan memberikan Dash yang berbeda secara kosmetik kepada pengguna untuk diklik.dash_subscription_doubler: Langganan yang memberi pengguna Dash dua kali lebih banyak per klik selama durasi langganan.
Buka Pembelian Dalam Aplikasi > Kelola.
Buat pembelian dalam aplikasi dengan ID yang ditentukan:
- Siapkan
dash_consumable_2ksebagai Consumable.
Gunakan dash_consumable_2k sebagai ID Produk. Nama referensi hanya digunakan di app store connect. Cukup setel ke dash consumable 2k dan tambahkan pelokalan untuk pembelian. Panggil pembelian Spring is in the air dengan 2000 dashes fly out sebagai deskripsi.
- Siapkan
dash_upgrade_3dsebagai Tidak habis pakai.
Gunakan dash_upgrade_3d sebagai ID Produk. Setel nama referensi ke dash upgrade 3d dan tambahkan pelokalan untuk pembelian. Panggil pembelian 3D Dash dengan Brings your dash back to the future sebagai deskripsi.
- Siapkan
dash_subscription_doublersebagai Langganan yang diperpanjang otomatis.
Alur untuk langganan sedikit berbeda. Pertama, Anda harus menetapkan Nama Referensi dan ID Produk:
Selanjutnya, Anda harus membuat grup langganan. Jika beberapa langganan merupakan bagian dari grup yang sama, pengguna hanya dapat berlangganan salah satu langganan tersebut secara bersamaan, tetapi dapat melakukan upgrade atau downgrade langganan dengan mudah. Cukup panggil grup ini subscriptions.
Selanjutnya, masukkan durasi langganan dan pelokalan. Beri nama langganan ini Jet Engine dengan deskripsi Doubles your clicks. Klik Save.
Setelah mengklik tombol Simpan, tambahkan harga langganan. Pilih harga berapa pun yang Anda inginkan.
Sekarang Anda akan melihat tiga pembelian tersebut dalam daftar pembelian:
5. Siapkan Play Store
Seperti halnya App Store, Anda juga memerlukan akun developer untuk Play Store. Jika Anda belum memilikinya, daftarkan akun.
Membuat aplikasi baru
Membuat aplikasi baru di Konsol Google Play:
- Buka Konsol Play.
- Pilih Semua aplikasi > Buat aplikasi.
- Pilih bahasa default dan tambahkan judul untuk aplikasi Anda. Ketik nama aplikasi sesuai keinginan Anda untuk muncul di Google Play. Anda dapat mengubah nama tersebut di lain waktu.
- Menetapkan bahwa aplikasi Anda adalah game. Anda dapat mengubahnya nanti.
- Tentukan apakah aplikasi Anda gratis atau berbayar.
- Tambahkan alamat email yang dapat digunakan pengguna Play Store untuk menghubungi Anda terkait aplikasi ini.
- Lengkapi panduan Konten dan pernyataan hukum ekspor Amerika Serikat.
- Pilih Buat aplikasi.
Setelah aplikasi dibuat, buka dasbor, dan selesaikan semua tugas di bagian Menyiapkan aplikasi. Di sini, Anda memberikan beberapa informasi tentang aplikasi Anda, seperti rating konten dan screenshot. 
Menandatangani permohonan
Agar dapat menguji pembelian dalam aplikasi, Anda perlu minimal satu build yang diupload ke Google Play.
Untuk hal ini, Anda perlu menandatangani build rilis dengan sesuatu selain kunci debug.
Membuat keystore
Jika Anda sudah memiliki keystore, lanjutkan ke langkah berikutnya. Jika tidak, buat dengan menjalankan perintah berikut di command line.
Di Mac/Linux, gunakan perintah berikut:
keytool -genkey -v -keystore ~/key.jks -keyalg RSA -keysize 2048 -validity 10000 -alias key
Di Windows, gunakan perintah berikut:
keytool -genkey -v -keystore c:\Users\USER_NAME\key.jks -storetype JKS -keyalg RSA -keysize 2048 -validity 10000 -alias key
Perintah ini menyimpan file key.jks di direktori utama Anda. Jika Anda ingin menyimpan file di tempat lain, ubah argumen yang Anda teruskan ke parameter -keystore. Jaga
keystore
file pribadi; jangan memeriksanya ke kontrol sumber publik.
Mereferensikan keystore dari aplikasi
Buat file bernama <your app dir>/android/key.properties yang berisi referensi ke keystore Anda:
storePassword=<password from previous step>
keyPassword=<password from previous step>
keyAlias=key
storeFile=<location of the key store file, such as /Users/<user name>/key.jks>
Mengonfigurasi penandatanganan di Gradle
Konfigurasikan penandatanganan untuk aplikasi Anda dengan mengedit file <your app dir>/android/app/build.gradle.
Tambahkan informasi keystore dari file properti Anda sebelum blok android:
def keystoreProperties = new Properties()
def keystorePropertiesFile = rootProject.file('key.properties')
if (keystorePropertiesFile.exists()) {
keystoreProperties.load(new FileInputStream(keystorePropertiesFile))
}
android {
// omitted
}
Muat file key.properties ke dalam objek keystoreProperties.
Tambahkan kode berikut sebelum blok buildTypes:
buildTypes {
release {
// TODO: Add your own signing config for the release build.
// Signing with the debug keys for now,
// so `flutter run --release` works.
signingConfig signingConfigs.debug
}
}
Konfigurasikan blok signingConfigs dalam file build.gradle modul Anda dengan informasi konfigurasi penandatanganan:
signingConfigs {
release {
keyAlias keystoreProperties['keyAlias']
keyPassword keystoreProperties['keyPassword']
storeFile keystoreProperties['storeFile'] ? file(keystoreProperties['storeFile']) : null
storePassword keystoreProperties['storePassword']
}
}
buildTypes {
release {
signingConfig signingConfigs.release
}
}
Build rilis aplikasi Anda kini akan ditandatangani secara otomatis.
Untuk mengetahui informasi selengkapnya tentang menandatangani aplikasi, lihat Menandatangani aplikasi di developer.android.com.
Mengupload build pertama Anda
Setelah aplikasi dikonfigurasi untuk penandatanganan, Anda seharusnya dapat membangun aplikasi dengan menjalankan:
flutter build appbundle
Perintah ini menghasilkan build rilis secara default dan output-nya dapat ditemukan di <your app dir>/build/app/outputs/bundle/release/
Dari dasbor di Konsol Google Play, buka Rilis > Pengujian > Pengujian tertutup, lalu membuat rilis pengujian tertutup baru.
Untuk codelab ini, Anda akan tetap berpegang pada penandatanganan aplikasi oleh Google. Jadi, lanjutkan dan tekan Lanjutkan di bagian Penandatanganan Aplikasi Play untuk ikut serta.
Selanjutnya, upload app bundle app-release.aab yang dihasilkan oleh perintah build.
Klik Simpan, lalu klik Tinjau rilis.
Terakhir, klik Start rollout to Internal testing untuk mengaktifkan rilis pengujian internal.
Menyiapkan pengguna pengujian
Agar dapat menguji pembelian dalam aplikasi, Akun Google penguji Anda harus ditambahkan di konsol Google Play di dua lokasi:
- Ke jalur pengujian tertentu (Pengujian internal)
- Sebagai penguji lisensi
Pertama, mulai dengan menambahkan penguji ke jalur pengujian internal. Kembali ke Rilis > Pengujian > Pengujian internal, lalu klik tab Penguji.
Buat daftar email baru dengan mengklik Buat daftar email. Beri nama daftar tersebut, dan tambahkan alamat email Akun Google yang memerlukan akses untuk menguji pembelian dalam aplikasi.
Berikutnya, centang kotak untuk daftar, lalu klik Simpan perubahan.
Kemudian, tambahkan penguji lisensi:
- Kembali ke tampilan Semua aplikasi di Konsol Google Play.
- Buka Setelan > Pengujian lisensi.
- Tambahkan alamat email yang sama dengan penguji yang harus dapat menguji pembelian dalam aplikasi.
- Tetapkan Respons lisensi ke
RESPOND_NORMALLY. - Klik Simpan perubahan.
Mengonfigurasi pembelian dalam aplikasi
Sekarang Anda akan mengonfigurasi item yang dapat dibeli dalam aplikasi.
Sama seperti di App Store, Anda harus menentukan tiga pembelian berbeda:
dash_consumable_2k: Pembelian habis pakai yang dapat dibeli berkali-kali, yang memberi pengguna 2000 Dash (mata uang dalam aplikasi) per pembelian.dash_upgrade_3d: "Upgrade" yang tidak habis pakai pembelian yang hanya bisa dibeli sekali, yang akan memberi pengguna Dash yang berbeda secara kosmetik untuk mengklik.dash_subscription_doubler: Langganan yang memberi pengguna Dash dua kali lebih banyak per klik selama durasi langganan.
Pertama, tambahkan produk habis pakai dan yang tidak habis pakai.
- Buka Konsol Google Play, lalu pilih aplikasi Anda.
- Buka Monetisasi > Produk > Produk dalam aplikasi.
- Klik Buat produk
- Masukkan semua informasi yang diperlukan untuk produk Anda. Pastikan ID produk sama persis dengan ID yang ingin Anda gunakan.
- Klik Simpan.
- Klik Aktifkan.
- Ulangi proses untuk "upgrade" yang tidak habis pakai pembelian.
Selanjutnya, tambahkan langganan:
- Buka Konsol Google Play, lalu pilih aplikasi Anda.
- Buka Monetisasi > Produk > Langganan.
- Klik Buat langganan
- Masukkan semua informasi yang diperlukan untuk langganan Anda. Pastikan ID produk sama persis dengan ID yang ingin Anda gunakan.
- Klik Simpan
Pembelian Anda sekarang seharusnya sudah disiapkan di Konsol Play.
6. Menyiapkan Firebase
Dalam codelab ini, Anda akan menggunakan layanan backend untuk memverifikasi dan melacak pembelian.
Menggunakan layanan backend memiliki beberapa manfaat:
- Anda dapat memverifikasi transaksi dengan aman.
- Anda dapat bereaksi terhadap peristiwa penagihan dari app store.
- Anda dapat melacak pembelian dalam database.
- Pengguna tidak akan bisa menipu aplikasi Anda untuk menyediakan fitur premium dengan memundurkan jam sistem mereka.
Meskipun ada banyak cara untuk menyiapkan layanan backend, Anda akan melakukannya menggunakan fungsi cloud dan Firestore, menggunakan Firebase milik Google.
Menulis backend dianggap di luar cakupan codelab ini, sehingga kode awal sudah menyertakan project Firebase yang menangani pembelian dasar untuk membantu Anda memulai.
Plugin Firebase juga disertakan dengan aplikasi awal.
Anda hanya perlu membuat project Firebase sendiri, mengonfigurasi aplikasi dan backend untuk Firebase, serta men-deploy backend.
Membuat project Firebase
Buka Firebase console, lalu buat project Firebase baru. Untuk contoh ini, panggil proyek Dash Clicker.
Di aplikasi backend, Anda mengaitkan pembelian dengan pengguna tertentu, sehingga Anda memerlukan autentikasi. Untuk itu, manfaatkan modul autentikasi Firebase dengan login dengan Google.
- Dari dasbor Firebase, buka Authentication dan aktifkan, jika perlu.
- Buka tab Sign-in method, lalu aktifkan penyedia login Google.
Karena Anda juga akan menggunakan database Firestore Firebase, aktifkan opsi ini juga.
Tetapkan aturan Cloud Firestore seperti ini:
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /purchases/{purchaseId} {
allow read: if request.auth != null && request.auth.uid == resource.data.userId
}
}
}
Menyiapkan Firebase untuk Flutter
Cara yang direkomendasikan untuk menginstal Firebase di aplikasi Flutter adalah dengan menggunakan FlutterFire CLI. Ikuti petunjuk seperti yang dijelaskan di halaman penyiapan.
Saat menjalankan konfigurasi flutterfire, pilih project yang baru saja Anda buat di langkah sebelumnya.
$ flutterfire configure
i Found 5 Firebase projects.
? Select a Firebase project to configure your Flutter application with ›
❯ in-app-purchases-1234 (in-app-purchases-1234)
other-flutter-codelab-1 (other-flutter-codelab-1)
other-flutter-codelab-2 (other-flutter-codelab-2)
other-flutter-codelab-3 (other-flutter-codelab-3)
other-flutter-codelab-4 (other-flutter-codelab-4)
<create a new project>
Selanjutnya, aktifkan iOS dan Android dengan memilih kedua platform.
? Which platforms should your configuration support (use arrow keys & space to select)? ›
✔ android
✔ ios
macos
web
Saat diminta untuk mengganti firebase_options.dart, pilih ya.
? Generated FirebaseOptions file lib/firebase_options.dart already exists, do you want to override it? (y/n) › yes
Menyiapkan Firebase untuk Android: Langkah lebih lanjut
Dari dasbor Firebase, buka Ringkasan Project, pilih Setelan, lalu pilih tab Umum.
Scroll ke bawah ke Your apps, lalu pilih aplikasi dashclicker (android).
Untuk mengizinkan login dengan Google dalam mode debug, Anda harus memberikan sidik jari hash SHA-1 sertifikat debug.
Mendapatkan hash sertifikat penandatanganan debug
Di root project aplikasi Flutter Anda, ubah direktori ke folder android/, lalu buat laporan penandatanganan.
cd android ./gradlew :app:signingReport
Anda akan melihat daftar besar kunci penandatanganan. Karena Anda mencari hash untuk sertifikat debug, cari sertifikat dengan properti Variant dan Config yang ditetapkan ke debug. Kemungkinan keystore berada di folder beranda Anda di bagian .android/debug.keystore.
> Task :app:signingReport
Variant: debug
Config: debug
Store: /<USER_HOME_FOLDER>/.android/debug.keystore
Alias: AndroidDebugKey
MD5: XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX
SHA1: XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX
SHA-256: XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX
Valid until: Tuesday, January 19, 2038
Salin hash SHA-1, dan isi kolom terakhir di dialog modal pengiriman aplikasi.
Menyiapkan Firebase untuk iOS: Langkah lebih lanjut
Buka ios/Runnder.xcworkspace dengan Xcode. Atau dengan IDE pilihan Anda.
Di VSCode, klik kanan folder ios/, lalu open in xcode.
Di Android Studio, klik kanan folder ios/, lalu klik flutter diikuti dengan opsi open iOS module in Xcode.
Untuk mengizinkan login dengan Google di iOS, tambahkan opsi konfigurasi CFBundleURLTypes ke file plist build Anda. (Lihat dokumen paket google_sign_in untuk informasi selengkapnya.) Dalam hal ini, filenya adalah ios/Runner/Info-Debug.plist dan ios/Runner/Info-Release.plist.
Pasangan nilai kunci telah ditambahkan, tetapi nilainya harus diganti:
- Dapatkan nilai untuk
REVERSED_CLIENT_IDdari fileGoogleService-Info.plist, tanpa elemen<string>..</string>yang mengelilinginya. - Ganti nilai di file
ios/Runner/Info-Debug.plistdanios/Runner/Info-Release.plistpada kunciCFBundleURLTypes.
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLSchemes</key>
<array>
<!-- TODO Replace this value: -->
<!-- Copied from GoogleService-Info.plist key REVERSED_CLIENT_ID -->
<string>com.googleusercontent.apps.REDACTED</string>
</array>
</dict>
</array>
Penyiapan Firebase kini sudah selesai.
7. Memproses info terbaru terkait pembelian
Di bagian codelab ini, Anda akan menyiapkan aplikasi untuk membeli produk. Proses ini termasuk memproses update dan error pembelian setelah aplikasi dimulai.
Memproses update pembelian
Di main.dart,, temukan widget MyHomePage yang memiliki Scaffold dengan BottomNavigationBar yang berisi dua halaman. Halaman ini juga membuat tiga Provider untuk DashCounter, DashUpgrades,, dan DashPurchases. DashCounter melacak jumlah Dash saat ini dan meningkatkannya secara otomatis. DashUpgrades mengelola upgrade yang dapat Anda beli dengan Dashes. Codelab ini berfokus pada DashPurchases.
Secara default, objek penyedia didefinisikan saat objek tersebut pertama kali diminta. Objek ini memproses update pembelian secara langsung saat aplikasi dimulai, jadi nonaktifkan pemuatan lambat pada objek ini dengan lazy: false:
lib/main.dart
ChangeNotifierProvider<DashPurchases>(
create: (context) => DashPurchases(
context.read<DashCounter>(),
),
lazy: false,
),
Anda juga memerlukan instance InAppPurchaseConnection. Namun, agar aplikasi tetap dapat diuji, Anda memerlukan beberapa cara untuk meniru koneksi. Untuk melakukannya, buat metode instance yang dapat diganti dalam pengujian, lalu tambahkan ke main.dart.
lib/main.dart
// Gives the option to override in tests.
class IAPConnection {
static InAppPurchase? _instance;
static set instance(InAppPurchase value) {
_instance = value;
}
static InAppPurchase get instance {
_instance ??= InAppPurchase.instance;
return _instance!;
}
}
Anda harus sedikit mengupdate pengujian jika ingin pengujian tetap berjalan. Periksa widget_test.dart di GitHub guna mengetahui kode lengkap untuk TestIAPConnection.
test/widget_test.dart
void main() {
testWidgets('App starts', (WidgetTester tester) async {
IAPConnection.instance = TestIAPConnection();
await tester.pumpWidget(const MyApp());
expect(find.text('Tim Sneath'), findsOneWidget);
});
}
Di lib/logic/dash_purchases.dart, buka kode untuk DashPurchases ChangeNotifier. Saat ini, hanya ada DashCounter yang bisa Anda tambahkan ke Dash yang dibeli.
Tambahkan properti langganan streaming, _subscription (dari jenis StreamSubscription<List<PurchaseDetails>> _subscription;), IAPConnection.instance,, dan impor. Kode yang dihasilkan akan terlihat seperti berikut:
lib/logic/dash_purchases.dart
import 'package:in_app_purchase/in_app_purchase.dart';
class DashPurchases extends ChangeNotifier {
late StreamSubscription<List<PurchaseDetails>> _subscription;
final iapConnection = IAPConnection.instance;
DashPurchases(this.counter);
}
Kata kunci late ditambahkan ke _subscription karena _subscription diinisialisasi di konstruktor. Project ini disiapkan agar menjadi non-nullable secara default (NNBD), yang berarti properti yang tidak dideklarasikan sebagai nullable harus memiliki nilai bukan null. Penentu late memungkinkan Anda menunda penentuan nilai ini.
Di konstruktor, dapatkan purchaseUpdatedStream dan mulai memproses streaming. Dalam metode dispose(), batalkan langganan streaming.
lib/logic/dash_purchases.dart
class DashPurchases extends ChangeNotifier {
DashCounter counter;
late StreamSubscription<List<PurchaseDetails>> _subscription;
final iapConnection = IAPConnection.instance;
DashPurchases(this.counter) {
final purchaseUpdated =
iapConnection.purchaseStream;
_subscription = purchaseUpdated.listen(
_onPurchaseUpdate,
onDone: _updateStreamOnDone,
onError: _updateStreamOnError,
);
}
@override
void dispose() {
_subscription.cancel();
super.dispose();
}
Future<void> buy(PurchasableProduct product) async {
// omitted
}
void _onPurchaseUpdate(List<PurchaseDetails> purchaseDetailsList) {
// Handle purchases here
}
void _updateStreamOnDone() {
_subscription.cancel();
}
void _updateStreamOnError(dynamic error) {
//Handle error here
}
}
Sekarang, aplikasi menerima update pembelian sehingga, di bagian berikutnya, Anda akan melakukan pembelian.
Sebelum melanjutkan, jalankan pengujian dengan "flutter test" untuk memverifikasi bahwa semuanya telah disiapkan dengan benar.
$ flutter test
00:01 +1: All tests passed!
8. Melakukan pembelian
Di bagian codelab ini, Anda akan mengganti produk tiruan yang saat ini ada dengan produk asli yang dapat dibeli. Produk ini dimuat dari toko, ditampilkan dalam daftar, dan dibeli saat mengetuk produk.
Menyesuaikan Pembelian Produk
PurchasableProduct menampilkan produk tiruan. Perbarui untuk menampilkan konten yang sebenarnya dengan mengganti class PurchasableProduct di purchasable_product.dart dengan kode berikut:
lib/model/purchasable_product.dart
import 'package:in_app_purchase/in_app_purchase.dart';
enum ProductStatus {
purchasable,
purchased,
pending,
}
class PurchasableProduct {
String get id => productDetails.id;
String get title => productDetails.title;
String get description => productDetails.description;
String get price => productDetails.price;
ProductStatus status;
ProductDetails productDetails;
PurchasableProduct(this.productDetails) : status = ProductStatus.purchasable;
}
Di dash_purchases.dart,, hapus pembelian contoh dan ganti dengan daftar kosong, List<PurchasableProduct> products = [];
Memuat pembelian yang tersedia
Agar pengguna dapat melakukan pembelian, muat pembelian dari toko. Pertama, periksa apakah toko tersedia. Jika toko tidak tersedia, menyetel storeState ke notAvailable akan menampilkan pesan error kepada pengguna.
lib/logic/dash_purchases.dart
Future<void> loadPurchases() async {
final available = await iapConnection.isAvailable();
if (!available) {
storeState = StoreState.notAvailable;
notifyListeners();
return;
}
}
Saat toko tersedia, muat pembelian yang tersedia. Dengan penyiapan Firebase sebelumnya, Anda akan melihat storeKeyConsumable, storeKeySubscription,, dan storeKeyUpgrade. Jika pembelian yang diharapkan tidak tersedia, cetak informasi ini ke konsol; Anda mungkin juga ingin mengirim
info ini ke layanan backend.
Metode await iapConnection.queryProductDetails(ids) menampilkan ID yang tidak ditemukan dan produk yang dapat dibeli yang ditemukan. Gunakan productDetails dari respons untuk mengupdate UI, dan setel StoreState ke available.
lib/logic/dash_purchases.dart
import '../constants.dart';
Future<void> loadPurchases() async {
final available = await iapConnection.isAvailable();
if (!available) {
storeState = StoreState.notAvailable;
notifyListeners();
return;
}
const ids = <String>{
storeKeyConsumable,
storeKeySubscription,
storeKeyUpgrade,
};
final response = await iapConnection.queryProductDetails(ids);
for (var element in response.notFoundIDs) {
debugPrint('Purchase $element not found');
}
products = response.productDetails.map((e) => PurchasableProduct(e)).toList();
storeState = StoreState.available;
notifyListeners();
}
Panggil fungsi loadPurchases() di konstruktor:
lib/logic/dash_purchases.dart
DashPurchases(this.counter) {
final purchaseUpdated = iapConnection.purchaseStream;
_subscription = purchaseUpdated.listen(
_onPurchaseUpdate,
onDone: _updateStreamOnDone,
onError: _updateStreamOnError,
);
loadPurchases();
}
Terakhir, ubah nilai kolom storeState dari StoreState.available menjadi StoreState.loading:
lib/logic/dash_purchases.dart
StoreState storeState = StoreState.loading;
Menampilkan produk yang dapat dibeli
Pertimbangkan file purchase_page.dart. Widget PurchasePage menampilkan _PurchasesLoading, _PurchaseList,, atau _PurchasesNotAvailable,, bergantung pada StoreState. Widget juga menampilkan pembelian sebelumnya oleh pengguna yang digunakan di langkah berikutnya.
Widget _PurchaseList menampilkan daftar produk yang dapat dibeli dan mengirim permintaan pembelian ke objek DashPurchases.
lib/pages/purchase_page.dart
class _PurchaseList extends StatelessWidget {
@override
Widget build(BuildContext context) {
var purchases = context.watch<DashPurchases>();
var products = purchases.products;
return Column(
children: products
.map((product) => _PurchaseWidget(
product: product,
onPressed: () {
purchases.buy(product);
}))
.toList(),
);
}
}
Anda akan dapat melihat produk yang tersedia di toko Android dan iOS jika dikonfigurasi dengan benar. Perhatikan bahwa perlu waktu beberapa saat sebelum pembelian tersedia saat dimasukkan ke konsol masing-masing.
Kembali ke dash_purchases.dart, dan terapkan fungsi untuk membeli produk. Anda hanya perlu memisahkan produk habis pakai dari yang tidak habis pakai. Produk upgrade dan langganan tidak habis pakai.
lib/logic/dash_purchases.dart
Future<void> buy(PurchasableProduct product) async {
final purchaseParam = PurchaseParam(productDetails: product.productDetails);
switch (product.id) {
case storeKeyConsumable:
await iapConnection.buyConsumable(purchaseParam: purchaseParam);
break;
case storeKeySubscription:
case storeKeyUpgrade:
await iapConnection.buyNonConsumable(purchaseParam: purchaseParam);
break;
default:
throw ArgumentError.value(
product.productDetails, '${product.id} is not a known product');
}
}
Sebelum melanjutkan, buat variabel _beautifiedDashUpgrade dan update pengambil beautifiedDash untuk mereferensikannya.
lib/logic/dash_purchases.dart
bool get beautifiedDash => _beautifiedDashUpgrade;
bool _beautifiedDashUpgrade = false;
Metode _onPurchaseUpdate menerima pembaruan pembelian, memperbarui status produk yang ditampilkan di halaman pembelian, dan menerapkan pembelian ke logika penghitung. Penting untuk memanggil completePurchase setelah menangani pembelian agar toko mengetahui bahwa pembelian ditangani dengan benar.
lib/logic/dash_purchases.dart
Future<void> _onPurchaseUpdate(
List<PurchaseDetails> purchaseDetailsList) async {
for (var purchaseDetails in purchaseDetailsList) {
await _handlePurchase(purchaseDetails);
}
notifyListeners();
}
Future<void> _handlePurchase(PurchaseDetails purchaseDetails) async {
if (purchaseDetails.status == PurchaseStatus.purchased) {
switch (purchaseDetails.productID) {
case storeKeySubscription:
counter.applyPaidMultiplier();
break;
case storeKeyConsumable:
counter.addBoughtDashes(2000);
break;
case storeKeyUpgrade:
_beautifiedDashUpgrade = true;
break;
}
}
if (purchaseDetails.pendingCompletePurchase) {
await iapConnection.completePurchase(purchaseDetails);
}
}
9. Siapkan backend
Sebelum beralih ke pelacakan dan verifikasi pembelian, siapkan backend Dart untuk mendukung tindakan tersebut.
Di bagian ini, lakukan pekerjaan dari folder dart-backend/ sebagai root.
Pastikan Anda telah menginstal alat berikut:
- Dart
- Firebase CLI
Ringkasan project dasar
Karena beberapa bagian dari project ini dianggap di luar cakupan codelab ini, bagian tersebut disertakan dalam kode awal. Sebaiknya pelajari apa yang sudah ada dalam kode awal sebelum memulai, untuk mendapatkan gambaran tentang cara Anda menyusun berbagai hal.
Kode backend ini dapat berjalan secara lokal di mesin Anda, Anda tidak perlu men-deploy-nya untuk menggunakannya. Namun, Anda harus dapat terhubung dari perangkat pengembangan (Android atau iPhone) ke komputer tempat server akan berjalan. Untuk itu, mereka harus berada di jaringan yang sama, dan Anda perlu mengetahui alamat IP komputer Anda.
Coba jalankan server menggunakan perintah berikut:
$ dart ./bin/server.dart
Serving at http://0.0.0.0:8080
Backend Dart menggunakan shelf dan shelf_router untuk menyalurkan endpoint API. Secara default, server tidak menyediakan rute apa pun. Nantinya, Anda akan membuat rute untuk menangani proses verifikasi pembelian.
Salah satu bagian yang sudah disertakan dalam kode awal adalah IapRepository di lib/iap_repository.dart. Karena mempelajari cara berinteraksi dengan Firestore, atau database secara umum, tidak dianggap relevan dengan codelab ini, kode awal berisi fungsi bagi Anda untuk membuat atau memperbarui pembelian di Firestore, serta semua class untuk pembelian tersebut.
Menyiapkan akses Firebase
Untuk mengakses Firebase Firestore, Anda memerlukan kunci akses akun layanan. Buat satu membuka setelan project Firebase dan buka bagian Service accounts, lalu pilih Buat kunci pribadi baru.
Salin file JSON yang didownload ke folder assets/, dan ganti namanya menjadi service-account-firebase.json.
Menyiapkan akses Google Play
Untuk mengakses Play Store guna memverifikasi pembelian, Anda harus membuat akun layanan dengan izin ini, dan mendownload kredensial JSON untuk akun tersebut.
- Buka Konsol Google Play, lalu mulai dari halaman Semua aplikasi.
- Buka Penyiapan > Akses API.
Jika Konsol Google Play meminta Anda membuat atau menautkan ke project yang sudah ada, lakukan hal tersebut terlebih dahulu lalu kembali ke halaman ini. - Cari bagian tempat Anda dapat menentukan akun layanan, lalu klik Buat akun layanan baru.
- Klik link Google Cloud Platform pada dialog yang muncul.
- Pilih project Anda. Jika tidak melihatnya, pastikan Anda login ke akun Google yang benar pada daftar drop-down Akun di kanan atas.
- Setelah memilih project, klik + Create Service Account di panel menu atas.
- Berikan nama untuk akun layanan. Anda juga dapat memberikan deskripsi agar Anda mengingat kegunaannya, lalu melanjutkan ke langkah berikutnya.
- Tetapkan peran Editor ke akun layanan.
- Selesaikan wizard, kembali ke halaman Akses API di konsol developer, lalu klik Muat ulang akun layanan. Anda akan melihat akun yang baru dibuat dalam daftar.
- Klik Berikan akses untuk akun layanan yang baru.
- Scroll ke bawah di halaman berikutnya, ke blok Data keuangan. Pilih Lihat data keuangan, pesanan, dan respons survei pembatalan serta Kelola pesanan dan langganan.
- Klik Undang pengguna.
- Setelah akun disiapkan, Anda hanya perlu membuat beberapa kredensial. Kembali ke konsol cloud, temukan akun layanan Anda di daftar akun layanan, klik tiga titik vertikal, lalu pilih Kelola kunci.
- Buat kunci JSON baru dan download.
- Ganti nama file yang didownload menjadi
service-account-google-play.json,, lalu pindahkan ke direktoriassets/.
Satu hal lagi yang perlu kita lakukan adalah membuka lib/constants.dart, dan mengganti nilai androidPackageId dengan ID paket yang Anda pilih untuk aplikasi Android.
Menyiapkan akses Apple App Store
Untuk mengakses App Store guna memverifikasi pembelian, Anda harus menyiapkan rahasia bersama:
- Buka App Store Connect.
- Buka Aplikasi Saya,lalu pilih aplikasi Anda.
- Di navigasi sidebar, buka In-App Purchases > Kelola.
- Di kanan atas daftar, klik Rahasia Bersama Khusus Aplikasi.
- Buat secret baru, lalu salin.
- Buka
lib/constants.dart,dan ganti nilaiappStoreSharedSecretdengan rahasia bersama yang baru saja Anda buat.
File konfigurasi konstanta
Sebelum melanjutkan, pastikan konstanta berikut dikonfigurasi dalam file lib/constants.dart:
androidPackageId: ID Paket yang digunakan di Android. mis.com.example.dashclickerappStoreSharedSecret: Rahasia bersama untuk mengakses App Store Connect agar dapat melakukan verifikasi pembelian.bundleId: ID paket yang digunakan di iOS. mis.com.example.dashclicker
Anda bisa mengabaikan konstanta lainnya untuk saat ini.
10. Memverifikasi pembelian
Alur umum untuk memverifikasi pembelian serupa untuk iOS dan Android.
Untuk kedua toko, aplikasi Anda menerima token saat pembelian dilakukan.
Token ini dikirimkan oleh aplikasi ke layanan backend Anda, yang kemudian, pada gilirannya, memverifikasi pembelian dengan server masing-masing toko menggunakan token yang diberikan.
Layanan backend kemudian dapat memilih untuk menyimpan pembelian, dan membalas aplikasi terlepas dari apakah pembelian valid atau tidak.
Dengan meminta layanan backend melakukan validasi dengan app store, bukan aplikasi yang berjalan di perangkat pengguna, Anda dapat mencegah pengguna mendapatkan akses ke fitur premium dengan, misalnya, memundurkan jam sistem mereka.
Menyiapkan sisi Flutter
Menyiapkan autentikasi
Saat akan mengirim pembelian ke layanan backend, Anda harus memastikan pengguna telah diautentikasi saat melakukan pembelian. Sebagian besar logika autentikasi sudah ditambahkan untuk Anda dalam project awal. Anda hanya perlu memastikan PurchasePage menampilkan tombol login saat pengguna belum login. Tambahkan kode berikut ke awal metode build PurchasePage:
lib/pages/purchase_page.dart
import '../logic/firebase_notifier.dart';
import '../model/firebase_state.dart';
import 'login_page.dart';
class PurchasePage extends StatelessWidget {
const PurchasePage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
var firebaseNotifier = context.watch<FirebaseNotifier>();
if (firebaseNotifier.state == FirebaseState.loading) {
return _PurchasesLoading();
} else if (firebaseNotifier.state == FirebaseState.notAvailable) {
return _PurchasesNotAvailable();
}
if (!firebaseNotifier.loggedIn) {
return const LoginPage();
}
// omitted
Endpoint verifikasi panggilan telepon dari aplikasi
Di aplikasi, buat fungsi _verifyPurchase(PurchaseDetails purchaseDetails) yang memanggil endpoint /verifypurchase di backend Dart menggunakan panggilan pasca http.
Kirim app store yang dipilih (google_play untuk Play Store atau app_store untuk App Store), serverVerificationData, dan productID. Server mengembalikan kode status yang menunjukkan apakah pembelian telah diverifikasi.
Dalam konstanta aplikasi, konfigurasikan IP server ke alamat IP mesin lokal Anda.
lib/logic/dash_purchases.dart
FirebaseNotifier firebaseNotifier;
DashPurchases(this.counter, this.firebaseNotifier) {
// omitted
}
Menambahkan firebaseNotifier dengan pembuatan DashPurchases di main.dart:
lib/main.dart
ChangeNotifierProvider<DashPurchases>(
create: (context) => DashPurchases(
context.read<DashCounter>(),
context.read<FirebaseNotifier>(),
),
lazy: false,
),
Tambahkan pengambil untuk Pengguna di FirebaseNotifier agar Anda dapat meneruskan ID pengguna ke fungsi verifikasi pembelian.
lib/logic/firebase_notifier.dart
User? get user => FirebaseAuth.instance.currentUser;
Tambahkan fungsi _verifyPurchase ke class DashPurchases. Fungsi async ini menampilkan boolean yang menunjukkan apakah pembelian divalidasi.
lib/logic/dash_purchases.dart
Future<bool> _verifyPurchase(PurchaseDetails purchaseDetails) async {
final url = Uri.parse('http://$serverIp:8080/verifypurchase');
const headers = {
'Content-type': 'application/json',
'Accept': 'application/json',
};
final response = await http.post(
url,
body: jsonEncode({
'source': purchaseDetails.verificationData.source,
'productId': purchaseDetails.productID,
'verificationData':
purchaseDetails.verificationData.serverVerificationData,
'userId': firebaseNotifier.user?.uid,
}),
headers: headers,
);
if (response.statusCode == 200) {
print('Successfully verified purchase');
return true;
} else {
print('failed request: ${response.statusCode} - ${response.body}');
return false;
}
}
Panggil fungsi _verifyPurchase di _handlePurchase tepat sebelum Anda menerapkan pembelian. Sebaiknya Anda hanya menerapkan pembelian saat sudah diverifikasi. Dalam aplikasi produksi, Anda dapat menentukan hal ini lebih lanjut, misalnya, menerapkan langganan uji coba saat toko tidak tersedia untuk sementara. Namun, untuk contoh ini, tetap sederhana, dan hanya terapkan pembelian saat pembelian berhasil diverifikasi.
lib/logic/dash_purchases.dart
Future<void> _onPurchaseUpdate(
List<PurchaseDetails> purchaseDetailsList) async {
for (var purchaseDetails in purchaseDetailsList) {
await _handlePurchase(purchaseDetails);
}
notifyListeners();
}
Future<void> _handlePurchase(PurchaseDetails purchaseDetails) async {
if (purchaseDetails.status == PurchaseStatus.purchased) {
// Send to server
var validPurchase = await _verifyPurchase(purchaseDetails);
if (validPurchase) {
// Apply changes locally
switch (purchaseDetails.productID) {
case storeKeySubscription:
counter.applyPaidMultiplier();
break;
case storeKeyConsumable:
counter.addBoughtDashes(1000);
break;
}
}
}
if (purchaseDetails.pendingCompletePurchase) {
await iapConnection.completePurchase(purchaseDetails);
}
}
Di aplikasi, semuanya kini siap memvalidasi pembelian.
Menyiapkan layanan backend
Selanjutnya, siapkan fungsi cloud untuk memverifikasi pembelian di backend.
Membuat pengendali pembelian
Karena alur verifikasi untuk kedua toko hampir identik, siapkan class PurchaseHandler abstrak dengan implementasi terpisah untuk setiap toko.
Mulailah dengan menambahkan file purchase_handler.dart ke folder lib/, tempat Anda menentukan class PurchaseHandler abstrak dengan dua metode abstrak untuk memverifikasi dua jenis pembelian yang berbeda: langganan dan non-langganan.
lib/purchase_handler.dart
import 'products.dart';
/// Generic purchase handler,
/// must be implemented for Google Play and Apple Store
abstract class PurchaseHandler {
/// Verify if non-subscription purchase (aka consumable) is valid
/// and update the database
Future<bool> handleNonSubscription({
required String userId,
required ProductData productData,
required String token,
});
/// Verify if subscription purchase (aka non-consumable) is valid
/// and update the database
Future<bool> handleSubscription({
required String userId,
required ProductData productData,
required String token,
});
}
Seperti yang dapat Anda lihat, setiap metode memerlukan tiga parameter:
userId:ID pengguna yang login, sehingga Anda dapat mengaitkan pembelian dengan pengguna.productData:Data tentang produk. Anda akan segera menentukannya.token:Token yang diberikan kepada pengguna oleh toko.
Selain itu, agar pengendali pembelian ini lebih mudah digunakan, tambahkan metode verifyPurchase() yang dapat digunakan untuk langganan dan non-langganan:
lib/purchase_handler.dart
/// Verify if purchase is valid and update the database
Future<bool> verifyPurchase({
required String userId,
required ProductData productData,
required String token,
}) async {
switch (productData.type) {
case ProductType.subscription:
return handleSubscription(
userId: userId,
productData: productData,
token: token,
);
case ProductType.nonSubscription:
return handleNonSubscription(
userId: userId,
productData: productData,
token: token,
);
}
}
Sekarang, Anda cukup memanggil verifyPurchase untuk kedua kasus tersebut, tetapi masih memiliki implementasi terpisah.
Class ProductData berisi informasi dasar tentang berbagai produk yang dapat dibeli, yang mencakup ID produk (terkadang juga disebut SKU) dan ProductType.
lib/products.dart
class ProductData {
final String productId;
final ProductType type;
const ProductData(this.productId, this.type);
}
ProductType dapat berupa langganan atau non-langganan.
lib/products.dart
enum ProductType {
subscription,
nonSubscription,
}
Terakhir, daftar produk didefinisikan sebagai peta dalam file yang sama.
lib/products.dart
const productDataMap = {
'dash_consumable_2k': ProductData(
'dash_consumable_2k',
ProductType.nonSubscription,
),
'dash_upgrade_3d': ProductData(
'dash_upgrade_3d',
ProductType.nonSubscription,
),
'dash_subscription_doubler': ProductData(
'dash_subscription_doubler',
ProductType.subscription,
),
};
Selanjutnya, tentukan beberapa penerapan placeholder untuk Google Play Store dan Apple App Store. Mulai dengan Google Play:
Buat lib/google_play_purchase_handler.dart, lalu tambahkan class yang memperluas PurchaseHandler yang baru saja Anda tulis:
lib/google_play_purchase_handler.dart
import 'dart:async';
import 'package:googleapis/androidpublisher/v3.dart' as ap;
import 'constants.dart';
import 'iap_repository.dart';
import 'products.dart';
import 'purchase_handler.dart';
class GooglePlayPurchaseHandler extends PurchaseHandler {
final ap.AndroidPublisherApi androidPublisher;
final IapRepository iapRepository;
GooglePlayPurchaseHandler(
this.androidPublisher,
this.iapRepository,
);
@override
Future<bool> handleNonSubscription({
required String? userId,
required ProductData productData,
required String token,
}) async {
return true;
}
@override
Future<bool> handleSubscription({
required String? userId,
required ProductData productData,
required String token,
}) async {
return true;
}
}
Untuk saat ini, metode ini menampilkan true untuk metode pengendali; Anda akan membahasnya nanti.
Seperti yang mungkin Anda perhatikan, konstruktor mengambil instance IapRepository. Pengendali pembelian menggunakan instance ini untuk menyimpan informasi tentang pembelian di Firestore nanti. Untuk berkomunikasi dengan Google Play, Anda menggunakan AndroidPublisherApi yang disediakan.
Berikutnya, lakukan hal yang sama untuk pengendali app store. Buat lib/app_store_purchase_handler.dart, lalu tambahkan class yang memperluas PurchaseHandler lagi:
lib/app_store_purchase_handler.dart
import 'dart:async';
import 'package:app_store_server_sdk/app_store_server_sdk.dart';
import 'constants.dart';
import 'iap_repository.dart';
import 'products.dart';
import 'purchase_handler.dart';
class AppStorePurchaseHandler extends PurchaseHandler {
final IapRepository iapRepository;
AppStorePurchaseHandler(
this.iapRepository,
);
@override
Future<bool> handleNonSubscription({
required String userId,
required ProductData productData,
required String token,
}) {
return true;
}
@override
Future<bool> handleSubscription({
required String userId,
required ProductData productData,
required String token,
}) {
return true;
}
}
Bagus! Sekarang Anda memiliki dua pengendali pembelian. Selanjutnya, mari kita buat endpoint API verifikasi pembelian.
Menggunakan pengendali pembelian
Buka bin/server.dart dan buat endpoint API menggunakan shelf_route:
bin/server.dart
Future<void> main() async {
final router = Router();
final purchaseHandlers = await _createPurchaseHandlers();
router.post('/verifypurchase', (Request request) async {
final dynamic payload = json.decode(await request.readAsString());
final (:userId, :source, :productData, :token) = getPurchaseData(payload);
final result = await purchaseHandlers[source]!.verifyPurchase(
userId: userId,
productData: productData,
token: token,
);
if (result) {
return Response.ok('all good!');
} else {
return Response.internalServerError();
}
});
await serveHandler(router);
}
({
String userId,
String source,
ProductData productData,
String token,
}) getPurchaseData(dynamic payload) {
if (payload
case {
'userId': String userId,
'source': String source,
'productId': String productId,
'verificationData': String token,
}) {
return (
userId: userId,
source: source,
productData: productDataMap[productId]!,
token: token,
);
} else {
throw const FormatException('Unexpected JSON');
}
}
Kode di atas melakukan hal berikut:
- Tentukan endpoint POST yang akan dipanggil dari aplikasi yang Anda buat sebelumnya.
- Dekode payload JSON dan ekstrak informasi berikut:
userId: ID pengguna yang saat ini loginsource: Penyimpanan yang digunakan,app_storeataugoogle_play.productData: Diperoleh dariproductDataMapyang Anda buat sebelumnya.token: Berisi data verifikasi yang akan dikirim ke toko.- Panggilan ke metode
verifyPurchase, baik untukGooglePlayPurchaseHandleratauAppStorePurchaseHandler, bergantung pada sumbernya. - Jika verifikasi berhasil, metode akan menampilkan
Response.okke klien. - Jika verifikasi gagal, metode akan menampilkan
Response.internalServerErrorke klien.
Setelah membuat endpoint API, Anda harus mengonfigurasi kedua pengendali pembelian. Langkah ini mengharuskan Anda memuat kunci akun layanan yang diperoleh di langkah sebelumnya dan mengonfigurasi akses ke berbagai layanan, termasuk Android Publisher API dan Firebase Firestore API. Kemudian, buat dua pengendali pembelian dengan dependensi yang berbeda:
bin/server.dart
Future<Map<String, PurchaseHandler>> _createPurchaseHandlers() async {
// Configure Android Publisher API access
final serviceAccountGooglePlay =
File('assets/service-account-google-play.json').readAsStringSync();
final clientCredentialsGooglePlay =
auth.ServiceAccountCredentials.fromJson(serviceAccountGooglePlay);
final clientGooglePlay =
await auth.clientViaServiceAccount(clientCredentialsGooglePlay, [
ap.AndroidPublisherApi.androidpublisherScope,
]);
final androidPublisher = ap.AndroidPublisherApi(clientGooglePlay);
// Configure Firestore API access
final serviceAccountFirebase =
File('assets/service-account-firebase.json').readAsStringSync();
final clientCredentialsFirebase =
auth.ServiceAccountCredentials.fromJson(serviceAccountFirebase);
final clientFirebase =
await auth.clientViaServiceAccount(clientCredentialsFirebase, [
fs.FirestoreApi.cloudPlatformScope,
]);
final firestoreApi = fs.FirestoreApi(clientFirebase);
final dynamic json = jsonDecode(serviceAccountFirebase);
final projectId = json['project_id'] as String;
final iapRepository = IapRepository(firestoreApi, projectId);
return {
'google_play': GooglePlayPurchaseHandler(
androidPublisher,
iapRepository,
),
'app_store': AppStorePurchaseHandler(
iapRepository,
),
};
}
Memverifikasi pembelian Android: Menerapkan pengendali pembelian
Berikutnya, lanjutkan penerapan pengendali pembelian Google Play.
Google sudah menyediakan paket Dart untuk berinteraksi dengan API yang Anda perlukan guna memverifikasi pembelian. Anda telah menginisialisasinya di file server.dart dan sekarang menggunakannya di class GooglePlayPurchaseHandler.
Terapkan pengendali untuk pembelian jenis non-langganan:
lib/google_play_purchase_handler.dart
@override
Future<bool> handleNonSubscription({
required String? userId,
required ProductData productData,
required String token,
}) async {
print(
'GooglePlayPurchaseHandler.handleNonSubscription'
'($userId, ${productData.productId}, ${token.substring(0, 5)}...)',
);
try {
// Verify purchase with Google
final response = await androidPublisher.purchases.products.get(
androidPackageId,
productData.productId,
token,
);
print('Purchases response: ${response.toJson()}');
// Make sure an order id exists
if (response.orderId == null) {
print('Could not handle purchase without order id');
return false;
}
final orderId = response.orderId!;
final purchaseData = NonSubscriptionPurchase(
purchaseDate: DateTime.fromMillisecondsSinceEpoch(
int.parse(response.purchaseTimeMillis ?? '0'),
),
orderId: orderId,
productId: productData.productId,
status: _nonSubscriptionStatusFrom(response.purchaseState),
userId: userId,
iapSource: IAPSource.googleplay,
);
// Update the database
if (userId != null) {
// If we know the userId,
// update the existing purchase or create it if it does not exist.
await iapRepository.createOrUpdatePurchase(purchaseData);
} else {
// If we do not know the user id, a previous entry must already
// exist, and thus we'll only update it.
await iapRepository.updatePurchase(purchaseData);
}
return true;
} on ap.DetailedApiRequestError catch (e) {
print(
'Error on handle NonSubscription: $e\n'
'JSON: ${e.jsonResponse}',
);
} catch (e) {
print('Error on handle NonSubscription: $e\n');
}
return false;
}
Anda dapat memperbarui pengendali pembelian langganan dengan cara yang sama:
lib/google_play_purchase_handler.dart
/// Handle subscription purchases.
///
/// Retrieves the purchase status from Google Play and updates
/// the Firestore Database accordingly.
@override
Future<bool> handleSubscription({
required String? userId,
required ProductData productData,
required String token,
}) async {
print(
'GooglePlayPurchaseHandler.handleSubscription'
'($userId, ${productData.productId}, ${token.substring(0, 5)}...)',
);
try {
// Verify purchase with Google
final response = await androidPublisher.purchases.subscriptions.get(
androidPackageId,
productData.productId,
token,
);
print('Subscription response: ${response.toJson()}');
// Make sure an order id exists
if (response.orderId == null) {
print('Could not handle purchase without order id');
return false;
}
final orderId = extractOrderId(response.orderId!);
final purchaseData = SubscriptionPurchase(
purchaseDate: DateTime.fromMillisecondsSinceEpoch(
int.parse(response.startTimeMillis ?? '0'),
),
orderId: orderId,
productId: productData.productId,
status: _subscriptionStatusFrom(response.paymentState),
userId: userId,
iapSource: IAPSource.googleplay,
expiryDate: DateTime.fromMillisecondsSinceEpoch(
int.parse(response.expiryTimeMillis ?? '0'),
),
);
// Update the database
if (userId != null) {
// If we know the userId,
// update the existing purchase or create it if it does not exist.
await iapRepository.createOrUpdatePurchase(purchaseData);
} else {
// If we do not know the user id, a previous entry must already
// exist, and thus we'll only update it.
await iapRepository.updatePurchase(purchaseData);
}
return true;
} on ap.DetailedApiRequestError catch (e) {
print(
'Error on handle Subscription: $e\n'
'JSON: ${e.jsonResponse}',
);
} catch (e) {
print('Error on handle Subscription: $e\n');
}
return false;
}
}
Tambahkan metode berikut untuk memfasilitasi penguraian ID pesanan, serta dua metode untuk mengurai status pembelian.
lib/google_play_purchase_handler.dart
/// If a subscription suffix is present (..#) extract the orderId.
String extractOrderId(String orderId) {
final orderIdSplit = orderId.split('..');
if (orderIdSplit.isNotEmpty) {
orderId = orderIdSplit[0];
}
return orderId;
}
NonSubscriptionStatus _nonSubscriptionStatusFrom(int? state) {
return switch (state) {
0 => NonSubscriptionStatus.completed,
2 => NonSubscriptionStatus.pending,
_ => NonSubscriptionStatus.cancelled,
};
}
SubscriptionStatus _subscriptionStatusFrom(int? state) {
return switch (state) {
// Payment pending
0 => SubscriptionStatus.pending,
// Payment received
1 => SubscriptionStatus.active,
// Free trial
2 => SubscriptionStatus.active,
// Pending deferred upgrade/downgrade
3 => SubscriptionStatus.pending,
// Expired or cancelled
_ => SubscriptionStatus.expired,
};
}
Pembelian Google Play Anda kini seharusnya sudah diverifikasi dan disimpan di database.
Berikutnya, lanjutkan ke pembelian di App Store untuk iOS.
Memverifikasi pembelian iOS: Menerapkan pengendali pembelian
Untuk memverifikasi pembelian dengan App Store, tersedia paket Dart pihak ketiga bernama app_store_server_sdk yang mempermudah prosesnya.
Mulai dengan membuat instance ITunesApi. Gunakan konfigurasi sandbox, serta aktifkan logging untuk memfasilitasi proses debug error.
lib/app_store_purchase_handler.dart
final _iTunesAPI = ITunesApi(
ITunesHttpClient(
ITunesEnvironment.sandbox(),
loggingEnabled: true,
),
);
Tidak seperti API Google Play, App Store menggunakan endpoint API yang sama untuk langganan dan non-langganan. Ini berarti Anda dapat menggunakan logika yang sama untuk kedua pengendali. Gabungkan semuanya sehingga menghasilkan implementasi yang sama:
lib/app_store_purchase_handler.dart
@override
Future<bool> handleNonSubscription({
required String userId,
required ProductData productData,
required String token,
}) {
return handleValidation(userId: userId, token: token);
}
@override
Future<bool> handleSubscription({
required String userId,
required ProductData productData,
required String token,
}) {
return handleValidation(userId: userId, token: token);
}
/// Handle purchase validation.
Future<bool> handleValidation({
required String userId,
required String token,
}) async {
//..
}
Sekarang, implementasikan handleValidation:
lib/app_store_purchase_handler.dart
/// Handle purchase validation.
Future<bool> handleValidation({
required String userId,
required String token,
}) async {
print('AppStorePurchaseHandler.handleValidation');
final response = await _iTunesAPI.verifyReceipt(
password: appStoreSharedSecret,
receiptData: token,
);
print('response: $response');
if (response.status == 0) {
print('Successfully verified purchase');
final receipts = response.latestReceiptInfo ?? [];
for (final receipt in receipts) {
final product = productDataMap[receipt.productId];
if (product == null) {
print('Error: Unknown product: ${receipt.productId}');
continue;
}
switch (product.type) {
case ProductType.nonSubscription:
await iapRepository.createOrUpdatePurchase(NonSubscriptionPurchase(
userId: userId,
productId: receipt.productId ?? '',
iapSource: IAPSource.appstore,
orderId: receipt.originalTransactionId ?? '',
purchaseDate: DateTime.fromMillisecondsSinceEpoch(
int.parse(receipt.originalPurchaseDateMs ?? '0')),
type: product.type,
status: NonSubscriptionStatus.completed,
));
break;
case ProductType.subscription:
await iapRepository.createOrUpdatePurchase(SubscriptionPurchase(
userId: userId,
productId: receipt.productId ?? '',
iapSource: IAPSource.appstore,
orderId: receipt.originalTransactionId ?? '',
purchaseDate: DateTime.fromMillisecondsSinceEpoch(
int.parse(receipt.originalPurchaseDateMs ?? '0')),
type: product.type,
expiryDate: DateTime.fromMillisecondsSinceEpoch(
int.parse(receipt.expiresDateMs ?? '0')),
status: SubscriptionStatus.active,
));
break;
}
}
return true;
} else {
print('Error: Status: ${response.status}');
return false;
}
}
Pembelian di App Store Anda sekarang seharusnya diverifikasi dan disimpan di database.
Menjalankan backend
Pada tahap ini, Anda dapat menjalankan dart bin/server.dart untuk menayangkan endpoint /verifypurchase.
$ dart bin/server.dart
Serving at http://0.0.0.0:8080
11. Pantau pembelian
Cara yang direkomendasikan untuk melacak pengguna Anda pembelian berada di layanan backend. Hal ini karena backend Anda dapat merespons peristiwa dari toko dan tidak terlalu rentan terhadap informasi usang karena penyimpanan cache, serta lebih tidak rentan terhadap modifikasi tidak sah.
Pertama, siapkan pemrosesan peristiwa toko di backend dengan backend Dart yang telah Anda buat.
Memproses peristiwa toko di backend
Toko memiliki kemampuan untuk memberi tahu backend Anda tentang setiap peristiwa penagihan yang terjadi, seperti saat langganan diperpanjang. Anda dapat memproses peristiwa ini di backend agar pembelian di database Anda tetap terkini. Di bagian ini, siapkan ini untuk Google Play Store dan Apple App Store.
Memproses acara layanan penagihan Google Play
Google Play menyediakan peristiwa penagihan melalui topik cloud pub/sub. Ini pada dasarnya adalah antrean pesan tempat pesan dapat dipublikasikan, serta dikonsumsi.
Karena fungsi ini khusus untuk Google Play, Anda menyertakan fungsi ini di GooglePlayPurchaseHandler.
Mulailah dengan membuka lib/google_play_purchase_handler.dart, dan tambahkan impor PubsubApi:
lib/google_play_purchase_handler.dart
import 'package:googleapis/pubsub/v1.dart' as pubsub;
Kemudian, teruskan PubsubApi ke GooglePlayPurchaseHandler, dan ubah konstruktor class untuk membuat Timer sebagai berikut:
lib/google_play_purchase_handler.dart
class GooglePlayPurchaseHandler extends PurchaseHandler {
final ap.AndroidPublisherApi androidPublisher;
final IapRepository iapRepository;
final pubsub.PubsubApi pubsubApi; // new
GooglePlayPurchaseHandler(
this.androidPublisher,
this.iapRepository,
this.pubsubApi, // new
) {
// Poll messages from Pub/Sub every 10 seconds
Timer.periodic(Duration(seconds: 10), (_) {
_pullMessageFromPubSub();
});
}
Timer dikonfigurasi untuk memanggil metode _pullMessageFromSubSub setiap sepuluh detik. Anda dapat menyesuaikan Durasi sesuai keinginan Anda.
Lalu, buat _pullMessageFromSubSub
lib/google_play_purchase_handler.dart
/// Process messages from Google Play
/// Called every 10 seconds
Future<void> _pullMessageFromPubSub() async {
print('Polling Google Play messages');
final request = pubsub.PullRequest(
maxMessages: 1000,
);
final topicName =
'projects/$googlePlayProjectName/subscriptions/$googlePlayPubsubBillingTopic-sub';
final pullResponse = await pubsubApi.projects.subscriptions.pull(
request,
topicName,
);
final messages = pullResponse.receivedMessages ?? [];
for (final message in messages) {
final data64 = message.message?.data;
if (data64 != null) {
await _processMessage(data64, message.ackId);
}
}
}
Future<void> _processMessage(String data64, String? ackId) async {
final dataRaw = utf8.decode(base64Decode(data64));
print('Received data: $dataRaw');
final dynamic data = jsonDecode(dataRaw);
if (data['testNotification'] != null) {
print('Skip test messages');
if (ackId != null) {
await _ackMessage(ackId);
}
return;
}
final dynamic subscriptionNotification = data['subscriptionNotification'];
final dynamic oneTimeProductNotification =
data['oneTimeProductNotification'];
if (subscriptionNotification != null) {
print('Processing Subscription');
final subscriptionId =
subscriptionNotification['subscriptionId'] as String;
final purchaseToken = subscriptionNotification['purchaseToken'] as String;
final productData = productDataMap[subscriptionId]!;
final result = await handleSubscription(
userId: null,
productData: productData,
token: purchaseToken,
);
if (result && ackId != null) {
await _ackMessage(ackId);
}
} else if (oneTimeProductNotification != null) {
print('Processing NonSubscription');
final sku = oneTimeProductNotification['sku'] as String;
final purchaseToken =
oneTimeProductNotification['purchaseToken'] as String;
final productData = productDataMap[sku]!;
final result = await handleNonSubscription(
userId: null,
productData: productData,
token: purchaseToken,
);
if (result && ackId != null) {
await _ackMessage(ackId);
}
} else {
print('invalid data');
}
}
/// ACK Messages from Pub/Sub
Future<void> _ackMessage(String id) async {
print('ACK Message');
final request = pubsub.AcknowledgeRequest(
ackIds: [id],
);
final subscriptionName =
'projects/$googlePlayProjectName/subscriptions/$googlePlayPubsubBillingTopic-sub';
await pubsubApi.projects.subscriptions.acknowledge(
request,
subscriptionName,
);
}
Kode yang baru saja Anda tambahkan berkomunikasi dengan Topik Pub/Sub dari Google Cloud setiap sepuluh detik dan meminta pesan baru. Kemudian, proses setiap pesan dalam metode _processMessage.
Metode ini mendekode pesan masuk dan mendapatkan informasi terbaru tentang setiap pembelian, baik langganan maupun non-langganan, yang memanggil handleSubscription atau handleNonSubscription yang ada jika perlu.
Setiap pesan harus dikonfirmasi dengan metode _askMessage.
Selanjutnya, tambahkan dependensi yang diperlukan ke file server.dart. Tambahkan PubsubApi.cloudPlatformScope ke konfigurasi kredensial:
bin/server.dart
final clientGooglePlay =
await auth.clientViaServiceAccount(clientCredentialsGooglePlay, [
ap.AndroidPublisherApi.androidpublisherScope,
pubsub.PubsubApi.cloudPlatformScope, // new
]);
Kemudian, buat instance PubsubApi:
bin/server.dart
final pubsubApi = pubsub.PubsubApi(clientGooglePlay);
Terakhir, teruskan ke konstruktor GooglePlayPurchaseHandler:
bin/server.dart
return {
'google_play': GooglePlayPurchaseHandler(
androidPublisher,
iapRepository,
pubsubApi, // new
),
'app_store': AppStorePurchaseHandler(
iapRepository,
),
};
Penyiapan Google Play
Anda telah menulis kode untuk menggunakan peristiwa penagihan dari topik pub/sub, tetapi Anda belum membuat topik pub/sub, dan Anda juga tidak memublikasikan peristiwa penagihan apa pun. Saatnya untuk menyiapkannya.
Pertama, buat topik pub/sub:
- Buka halaman Cloud Pub/Sub di Google Cloud Console.
- Pastikan Anda berada di project Firebase, lalu klik + Create Topic.
- Beri nama topik baru, yang sama dengan nilai yang ditetapkan untuk
GOOGLE_PLAY_PUBSUB_BILLING_TOPICdiconstants.ts. Dalam hal ini, beri namaplay_billing. Jika Anda memilih yang lain, pastikan untuk mengupdateconstants.ts. Buat topik.
- Dalam daftar topik pub/sub, klik tiga titik vertikal untuk topik yang baru saja dibuat, lalu klik Lihat izin.
- Di sidebar sebelah kanan, pilih Add principal.
- Di sini, tambahkan
google-play-developer-notifications@system.gserviceaccount.com, dan berikan peran Pub/Sub Publisher.
- Simpan perubahan izin.
- Salin Nama topik topik yang baru saja Anda buat.
- Buka Konsol Play lagi, lalu pilih aplikasi Anda dari daftar Semua Aplikasi.
- Scroll ke bawah dan buka Monetisasi > Penyiapan Monetisasi.
- Isi topik lengkap dan simpan perubahan Anda.
Semua acara layanan penagihan Google Play kini akan dipublikasikan terkait topik tersebut.
Memproses acara penagihan App Store
Berikutnya, lakukan hal yang sama untuk peristiwa penagihan App Store. Ada dua cara efektif untuk menerapkan penanganan pembaruan dalam pembelian untuk App Store. Salah satunya adalah dengan mengimplementasikan webhook yang Anda sediakan ke Apple dan yang digunakan untuk berkomunikasi dengan server Anda. Cara kedua, yang akan Anda temukan di codelab ini, adalah dengan menghubungkan ke App Store Server API dan mendapatkan informasi langganan secara manual.
Alasan codelab ini berfokus pada solusi kedua adalah karena Anda harus mengekspos server ke Internet agar dapat mengimplementasikan webhook.
Dalam lingkungan produksi, idealnya Anda ingin memiliki keduanya. Webhook untuk mendapatkan peristiwa dari App Store, dan Server API jika Anda melewatkan acara atau perlu memeriksa ulang status langganan.
Mulailah dengan membuka lib/app_store_purchase_handler.dart, dan menambahkan dependensi AppStoreServerAPI:
lib/app_store_purchase_handler.dart
final AppStoreServerAPI appStoreServerAPI;
AppStorePurchaseHandler(
this.iapRepository,
this.appStoreServerAPI, // new
)
Ubah konstruktor untuk menambahkan timer yang akan memanggil metode _pullStatus. Timer ini akan memanggil metode _pullStatus setiap 10 detik. Anda dapat menyesuaikan durasi timer ini dengan kebutuhan Anda.
lib/app_store_purchase_handler.dart
AppStorePurchaseHandler(
this.iapRepository,
this.appStoreServerAPI,
) {
// Poll Subscription status every 10 seconds.
Timer.periodic(Duration(seconds: 10), (_) {
_pullStatus();
});
}
Kemudian, buat metode _pullStatus sebagai berikut:
lib/app_store_purchase_handler.dart
Future<void> _pullStatus() async {
print('Polling App Store');
final purchases = await iapRepository.getPurchases();
// filter for App Store subscriptions
final appStoreSubscriptions = purchases.where((element) =>
element.type == ProductType.subscription &&
element.iapSource == IAPSource.appstore);
for (final purchase in appStoreSubscriptions) {
final status =
await appStoreServerAPI.getAllSubscriptionStatuses(purchase.orderId);
// Obtain all subscriptions for the order id.
for (final subscription in status.data) {
// Last transaction contains the subscription status.
for (final transaction in subscription.lastTransactions) {
final expirationDate = DateTime.fromMillisecondsSinceEpoch(
transaction.transactionInfo.expiresDate ?? 0);
// Check if subscription has expired.
final isExpired = expirationDate.isBefore(DateTime.now());
print('Expiration Date: $expirationDate - isExpired: $isExpired');
// Update the subscription status with the new expiration date and status.
await iapRepository.updatePurchase(SubscriptionPurchase(
userId: null,
productId: transaction.transactionInfo.productId,
iapSource: IAPSource.appstore,
orderId: transaction.originalTransactionId,
purchaseDate: DateTime.fromMillisecondsSinceEpoch(
transaction.transactionInfo.originalPurchaseDate),
type: ProductType.subscription,
expiryDate: expirationDate,
status: isExpired
? SubscriptionStatus.expired
: SubscriptionStatus.active,
));
}
}
}
}
Cara kerja metode ini adalah sebagai berikut:
- Mendapatkan daftar langganan aktif dari Firestore menggunakan IapRepository.
- Untuk setiap pesanan, status langganan akan diminta ke App Store Server API.
- Mendapatkan transaksi terakhir untuk pembelian langganan tersebut.
- Memeriksa tanggal habis masa berlaku.
- Memperbarui status langganan di Firestore. Jika masa berlakunya habis, langganan akan ditandai sebagaimana mestinya.
Terakhir, tambahkan semua kode yang diperlukan untuk mengonfigurasi akses App Store Server API:
bin/server.dart
// add from here
final subscriptionKeyAppStore =
File('assets/SubscriptionKey.p8').readAsStringSync();
// Configure Apple Store API access
var appStoreEnvironment = AppStoreEnvironment.sandbox(
bundleId: bundleId,
issuerId: appStoreIssuerId,
keyId: appStoreKeyId,
privateKey: subscriptionKeyAppStore,
);
// Stored token for Apple Store API access, if available
final file = File('assets/appstore.token');
String? appStoreToken;
if (file.existsSync() && file.lengthSync() > 0) {
appStoreToken = file.readAsStringSync();
}
final appStoreServerAPI = AppStoreServerAPI(
AppStoreServerHttpClient(
appStoreEnvironment,
jwt: appStoreToken,
jwtTokenUpdatedCallback: (token) {
file.writeAsStringSync(token);
},
),
);
// to here
return {
'google_play': GooglePlayPurchaseHandler(
androidPublisher,
iapRepository,
pubsubApi,
),
'app_store': AppStorePurchaseHandler(
iapRepository,
appStoreServerAPI, // new
),
};
Penyiapan App Store
Berikutnya, siapkan App Store:
- Login ke App Store Connect, lalu pilih Pengguna dan Akses.
- Buka Jenis Kunci > Pembelian Dalam Aplikasi.
- Ketuk "plus" untuk menambahkan yang baru.
- Beri nama, mis. "Kunci Codelab".
- Download file p8 yang berisi kunci tersebut.
- Salin file tersebut ke folder aset, dengan nama
SubscriptionKey.p8. - Salin ID kunci dari kunci yang baru dibuat dan tetapkan ke konstanta
appStoreKeyIddalam filelib/constants.dart. - Salin ID Penerbit tepat di bagian atas daftar kunci, dan tetapkan ke konstanta
appStoreIssuerIddalam filelib/constants.dart.
Melacak pembelian di perangkat
Cara paling aman untuk melacak pembelian Anda adalah di sisi server karena klien sulit diamankan, tetapi Anda harus memiliki beberapa cara untuk menyampaikan informasi tersebut ke klien sehingga aplikasi dapat menindaklanjuti informasi status langganan. Dengan menyimpan pembelian di Firestore, Anda dapat dengan mudah menyinkronkan data ke klien dan terus memperbaruinya secara otomatis.
Anda sudah menyertakan IAPRepo di aplikasi, yang merupakan repositori Firestore yang berisi semua data pembelian pengguna di List<PastPurchase> purchases. Repositori juga berisi hasActiveSubscription, yang benar saat ada pembelian dengan productId storeKeySubscription dengan status yang belum habis masa berlakunya. Bila pengguna tidak masuk, daftar ini akan kosong.
lib/repo/iap_repo.dart
void updatePurchases() {
_purchaseSubscription?.cancel();
var user = _user;
if (user == null) {
purchases = [];
hasActiveSubscription = false;
hasUpgrade = false;
return;
}
var purchaseStream = _firestore
.collection('purchases')
.where('userId', isEqualTo: user.uid)
.snapshots();
_purchaseSubscription = purchaseStream.listen((snapshot) {
purchases = snapshot.docs.map((DocumentSnapshot document) {
var data = document.data();
return PastPurchase.fromJson(data);
}).toList();
hasActiveSubscription = purchases.any((element) =>
element.productId == storeKeySubscription &&
element.status != Status.expired);
hasUpgrade = purchases.any(
(element) => element.productId == storeKeyUpgrade,
);
notifyListeners();
});
}
Semua logika pembelian berada di class DashPurchases dan merupakan tempat langganan harus diterapkan atau dihapus. Jadi, tambahkan iapRepo sebagai properti di class dan tetapkan iapRepo di konstruktor. Selanjutnya, langsung tambahkan pemroses di konstruktor, dan hapus pemroses dalam metode dispose(). Pada awalnya, pemroses hanya dapat berupa fungsi kosong. Karena IAPRepo adalah ChangeNotifier dan Anda memanggil notifyListeners() setiap kali pembelian di Firestore berubah, metode purchasesUpdate() selalu dipanggil saat produk yang dibeli berubah.
lib/logic/dash_purchases.dart
IAPRepo iapRepo;
DashPurchases(this.counter, this.firebaseNotifier, this.iapRepo) {
final purchaseUpdated =
iapConnection.purchaseStream;
_subscription = purchaseUpdated.listen(
_onPurchaseUpdate,
onDone: _updateStreamOnDone,
onError: _updateStreamOnError,
);
iapRepo.addListener(purchasesUpdate);
loadPurchases();
}
@override
void dispose() {
iapRepo.removeListener(purchasesUpdate);
_subscription.cancel();
super.dispose();
}
void purchasesUpdate() {
//TODO manage updates
}
Selanjutnya, berikan IAPRepo ke konstruktor di main.dart. Anda bisa mendapatkan repositori dengan menggunakan context.read karena sudah dibuat di Provider.
lib/main.dart
ChangeNotifierProvider<DashPurchases>(
create: (context) => DashPurchases(
context.read<DashCounter>(),
context.read<FirebaseNotifier>(),
context.read<IAPRepo>(),
),
lazy: false,
),
Selanjutnya, tulis kode untuk fungsi purchaseUpdate(). Di dash_counter.dart,, metode applyPaidMultiplier dan removePaidMultiplier masing-masing menetapkan pengganda ke 10 atau 1, sehingga Anda tidak perlu memeriksa apakah langganan sudah diterapkan. Saat status langganan berubah, Anda juga dapat memperbarui status produk yang dapat dibeli sehingga Anda dapat menunjukkan di halaman pembelian bahwa produk sudah aktif. Tetapkan properti _beautifiedDashUpgrade berdasarkan apakah upgrade dibeli atau tidak.
lib/logic/dash_purchases.dart
void purchasesUpdate() {
var subscriptions = <PurchasableProduct>[];
var upgrades = <PurchasableProduct>[];
// Get a list of purchasable products for the subscription and upgrade.
// This should be 1 per type.
if (products.isNotEmpty) {
subscriptions = products
.where((element) => element.productDetails.id == storeKeySubscription)
.toList();
upgrades = products
.where((element) => element.productDetails.id == storeKeyUpgrade)
.toList();
}
// Set the subscription in the counter logic and show/hide purchased on the
// purchases page.
if (iapRepo.hasActiveSubscription) {
counter.applyPaidMultiplier();
for (var element in subscriptions) {
_updateStatus(element, ProductStatus.purchased);
}
} else {
counter.removePaidMultiplier();
for (var element in subscriptions) {
_updateStatus(element, ProductStatus.purchasable);
}
}
// Set the Dash beautifier and show/hide purchased on
// the purchases page.
if (iapRepo.hasUpgrade != _beautifiedDashUpgrade) {
_beautifiedDashUpgrade = iapRepo.hasUpgrade;
for (var element in upgrades) {
_updateStatus(
element,
_beautifiedDashUpgrade
? ProductStatus.purchased
: ProductStatus.purchasable);
}
notifyListeners();
}
}
void _updateStatus(PurchasableProduct product, ProductStatus status) {
if (product.status != ProductStatus.purchased) {
product.status = ProductStatus.purchased;
notifyListeners();
}
}
Anda kini telah memastikan bahwa status langganan dan upgrade selalu terbaru di layanan backend dan disinkronkan dengan aplikasi. Aplikasi ini bertindak sebagaimana mestinya dan menerapkan fitur langganan dan upgrade ke game Dash clicker Anda.
12. Selesai!
Selamat. Anda telah menyelesaikan codelab. Anda dapat menemukan kode lengkap untuk codelab ini di 
folder lengkap.
Untuk mempelajari lebih lanjut, coba codelab Flutter lain.