Flow ve paywall olaylarını yönetme - React Native
Bu rehber; satın almalar, geri yüklemeler, ürün seçimi ve flow render işlemleri için olay yönetimini kapsar. Ayrıca buton yönetimini de (flow’u kapatma, bağlantı açma, özel eylemler vb.) ayarlayabilirsiniz. Ayrıntılar için buton eylemlerini yönetme rehberimize bakın.
Flow Builder ile oluşturulan flow’lar ve paywall’lar, satın alma yapmak ve geri yüklemek için ekstra koda ihtiyaç duymaz. Ancak uygulamanızın yanıt verebileceği bazı olaylar üretirler. Bu olaylar; buton tıklamalarını (kapatma butonları, URL’ler, ürün seçimleri vb.) ve flow üzerinde gerçekleştirilen satın almayla ilgili eylemlere ait bildirimleri içerir. Bu olaylara nasıl yanıt vereceğinizi aşağıda öğrenin.
Mobil uygulamanızda flow ekranında gerçekleşen süreçleri kontrol etmek veya izlemek için olay işleyicilerini uygulayın:
Olay örnekleri (Genişletmek için tıklayın)
// onCloseButtonPress
{
//Record the event
}
// onAndroidSystemBack
{
//Record the event
}
// onUrlPress
{
"url": "https://example.com/terms"
}
// onCustomAction
{
"actionId": "login"
}
// onProductSelected
{
"productId": "premium_monthly"
}
// onPurchaseStarted
{
"product": {
"vendorProductId": "premium_monthly",
"localizedTitle": "Premium Monthly",
"localizedDescription": "Premium subscription for 1 month",
"price": {
"amount": 9.99,
"currencyCode": "USD",
"currencySymbol": "$",
"localizedString": "$9.99"
}
}
}
// onPurchaseCompleted - Success
{
"purchaseResult": {
"type": "success",
"profile": {
"accessLevels": {
"premium": {
"id": "premium",
"isActive": true,
"expiresAt": "2024-02-15T10:30:00Z"
}
}
}
},
"product": {
"vendorProductId": "premium_monthly",
"localizedTitle": "Premium Monthly",
"localizedDescription": "Premium subscription for 1 month",
"price": {
"amount": 9.99,
"currencyCode": "USD",
"currencySymbol": "$",
"localizedString": "$9.99"
}
}
}
// onPurchaseCompleted - Cancelled
{
"purchaseResult": {
"type": "user_cancelled"
},
"product": {
"vendorProductId": "premium_monthly",
"localizedTitle": "Premium Monthly",
"localizedDescription": "Premium subscription for 1 month",
"price": {
"amount": 9.99,
"currencyCode": "USD",
"currencySymbol": "$",
"localizedString": "$9.99"
}
}
}
// onPurchaseFailed
{
"error": {
"code": "purchase_failed",
"message": "Purchase failed due to insufficient funds",
"details": {
"underlyingError": "Insufficient funds in account"
}
},
"product": {
"vendorProductId": "premium_monthly",
"localizedTitle": "Premium Monthly",
"localizedDescription": "Premium subscription for 1 month",
"price": {
"amount": 9.99,
"currencyCode": "USD",
"currencySymbol": "$",
"localizedString": "$9.99"
}
}
}
// onRestoreCompleted
{
"profile": {
"accessLevels": {
"premium": {
"id": "premium",
"isActive": true,
"expiresAt": "2024-02-15T10:30:00Z"
}
},
"subscriptions": [
{
"vendorProductId": "premium_monthly",
"isActive": true,
"expiresAt": "2024-02-15T10:30:00Z"
}
]
}
}
// onRestoreFailed
{
"error": {
"code": "restore_failed",
"message": "Purchase restoration failed",
"details": {
"underlyingError": "No previous purchases found"
}
}
}
// onError
{
"error": {
"code": "rendering_failed",
"message": "Failed to render flow interface",
"details": {
"underlyingError": "Invalid flow configuration"
}
}
}
// onLoadingProductsFailed
{
"error": {
"code": "products_loading_failed",
"message": "Failed to load products from the server",
"details": {
"underlyingError": "Network timeout"
}
}
}
// onAppeared
{
"view": {
"id": "3f8a1c7e-9b24-4d51-8e30-6c5b2a9f1d47",
"placementId": "onboarding_paywall",
"variationId": "d21c4b6a-57e8-4f39-b0a2-8c7e13f5d94b",
"locale": "es"
}
}
// onDisappeared
{
//Record the event
}
// onWebPaymentNavigationFinished
{
//Record the event
}İhtiyacınız olan olay işleyicilerini kaydedebilir, ihtiyacınız olmayanları atlayabilirsiniz. Bu durumda, kullanılmayan olay dinleyicileri oluşturulmaz. Zorunlu olay işleyicisi yoktur.
Olay işleyicileri bir boolean döndürür. true döndürülürse, görüntüleme süreci tamamlanmış sayılır; böylece flow ekranı kapanır ve bu view için olay dinleyicileri kaldırılır.
Bazı olay işleyicilerinin, gerekirse geçersiz kılabileceğiniz bir varsayılan davranışı vardır:
onCloseButtonPress: kapatma butonuna basıldığında flow’u kapatır.onUrlPress: tıklanan URL’yi açar ve flow’u açık tutar.onAndroidSystemBack(yalnızca modal sunum için): Back butonuna basıldığında flow’u açık tutar. Kapatmak içintruedöndürün.onRestoreCompleted: başarılı bir geri yüklemeden sonra flow’u açık tutar. Kapatmak içintruedöndürün.onPurchaseCompleted: bir satın alma tamamlandıktan sonra flow’u açık tutar. Kapatmak içintruedöndürün.onError: render başarısız olursa flow’u kapatır.
Olay işleyicileri
| Olay işleyici | Açıklama |
|---|---|
| onCustomAction | Kullanıcı özel bir eylem gerçekleştirdiğinde, örneğin bir özel düğmeye tıkladığında çağrılır. |
| onUrlPress | Kullanıcı flow’unuzdaki bir URL’ye tıkladığında çağrılır. |
| onAndroidSystemBack | Yalnızca modal sunum: Kullanıcı Android sistem Back düğmesine dokunduğunda çağrılır. |
| onCloseButtonPress | Kapat düğmesi görünürken kullanıcı ona dokunduğunda çağrılır. Bu işleyicide flow ekranını kapatmanız önerilir. |
| onPurchaseCompleted | Satın alma tamamlandığında, ister başarılı olsun, ister kullanıcı tarafından iptal edilsin, ister onay beklesin, çağrılır. Başarılı satın almalarda güncellenmiş bir AdaptyProfile sağlar. Kullanıcı iptalleri ve bekleyen ödemeler (örneğin, ebeveyn onayı gerekenler) bu olayı tetikler, onPurchaseFailed’ı değil. |
| onPurchaseStarted | Kullanıcı satın alma sürecini başlatmak için “Purchase” eylem düğmesine dokunduğunda çağrılır. |
| onPurchaseFailed | Satın alma hatalar nedeniyle başarısız olduğunda (örneğin, ödeme kısıtlamaları, geçersiz ürünler, ağ hataları, işlem doğrulama hataları) çağrılır. Kullanıcı iptalleri veya bekleyen ödemeler için çağrılmaz; bunlar onPurchaseCompleted’ı tetikler. |
| onRestoreStarted | Kullanıcı bir satın alma geri yükleme işlemi başlattığında çağrılır. |
| onRestoreCompleted | Satın alma geri yükleme başarılı olduğunda çağrılır ve güncellenmiş bir AdaptyProfile sağlar. Kullanıcının gerekli accessLevel’a sahipse ekranı kapatmanız önerilir. Nasıl kontrol edileceğini öğrenmek için Abonelik durumu konusuna bakın. |
| onRestoreFailed | Geri yükleme işlemi başarısız olduğunda çağrılır ve AdaptyError sağlar. |
| onProductSelected | Flow görünümünde herhangi bir ürün seçildiğinde çağrılır; bu sayede satın alma öncesinde kullanıcının ne seçtiğini izleyebilirsiniz. |
| onError | Görünüm oluşturma sırasında bir hata oluştuğunda çağrılır ve AdaptyError sağlar. Bu tür hatalar oluşmamalıdır; biriyle karşılaşırsanız lütfen bize bildirin. |
| onLoadingProductsFailed | Ürün yükleme başarısız olduğunda çağrılır ve AdaptyError sağlar. Görünüm oluşturmada prefetchProducts: true ayarlamadıysanız AdaptyUI gerekli nesneleri sunucudan kendisi alacaktır. |
| onAppeared | Flow kullanıcıya gösterildiğinde çağrılır ve görünen view’ı sağlar — bkz. View argümanı. iOS’ta, kullanıcı bir flow içindeki web paywall düğmesine dokunup bir web paywall uygulama içi tarayıcıda açıldığında da çağrılır. |
| onDisappeared | Yalnızca modal sunum: Flow kullanıcı tarafından kapatıldığında çağrılır. iOS’ta, bir flow’dan uygulama içi tarayıcıda açılan bir web paywall ekrandan kaybolduğunda da çağrılır. |
| onWebPaymentNavigationFinished | Satın alma için bir web paywall açılmaya çalışıldıktan sonra, başarılı veya başarısız olsun, çağrılır. |
| onAnalytics | Flow bir ekran görüntüleme gibi bir analitik olay bildirdiğinde çağrılır. Aşağıdaki Analitik olaylar bölümüne bakın. |
| onRequestAppReview | Bir flow’dan gelen uygulama inceleme istekleri için ayrılmıştır. Flow’lar henüz uygulama inceleme isteği tetiklemediğinden bunu uygulamanıza gerek yoktur. |
| onRequestPermission | Bir flow’dan gelen sistem izin istekleri (push bildirimleri veya kamera erişimi gibi) için ayrılmıştır. Flow’lar henüz izin isteği tetiklemediğinden bunu uygulamanıza gerek yoktur. |
| onObserverPurchaseInitiated | Yalnızca gözlemci modu: Kullanıcı bir flow’da satın alma düğmesine dokunduğunda çağrılır. Adapty satın almayı gerçekleştirmez — kendi satın alma kodunuzla yapın, ardından işlemi Adapty’ye bildirin. Aşağıdaki Gözlemci modunda satın almaları yönetme bölümüne bakın. |
| onObserverRestoreInitiated | Yalnızca gözlemci modu: Kullanıcı bir flow’da geri yükleme düğmesine dokunduğunda çağrılır. Adapty geri yükleme yapmaz — kendiniz yapın, ardından geri yüklenen işlemleri bildirin. Aşağıdaki Gözlemci modunda satın almaları yönetme bölümüne bakın. |
view argümanı
view argümanı, React Native SDK 4.0.3 veya üstünü gerektirir. Flow handler’ların tümü içinde yalnızca onAppeared, görünümün kendisini açıklayan bir FlowEventView nesnesini alır. Bu nesne şu alanları içerir:
| Alan | Açıklama |
|---|---|
| id | Bu view örneğinin tanımlayıcısı. SDK’ya özgüdür ve Adapty Kontrol Paneli’ndeki hiçbir şeyle eşleşmez. |
| placementId | Flow’un getirildiği placement. |
| variationId | Flow’un çözümlendiği varyant; kendi analizlerinizi bir A/B testine bağlamak için kullanılır. |
| locale | View’ın oluşturulduğu flow lokalizasyonu. Flow’un istediğiniz lokalizasyona sahip olmaması durumunda bu değer, talep ettiğiniz locale’den farklı olabilir. Flow’un hangi dilde render edildiğini anlamak ve ekranınızın geri kalanını buna göre uyarlamak için bu değeri okuyun. Bkz. Lokalizasyon ve locale kodlarını kullanma. |
Analitik olaylar
const unsubscribe = view.setEventHandlers({
onAnalytics(name, params) {
return false; // keep the flow open
},
});Bir flow, kullanıcı ekranlarından birini her açtığında flow_screen_showed olayını raporlar. Adapty bu olayları kendi flow analitiğinde sayar ve uygulamanıza da iletir; böylece aynı dönüşüm hunisini kendi analitiğinizde oluşturabilirsiniz.
| Parametre | Açıklama |
|---|---|
instanceId | Kullanıcının açtığı ekranın ID’si. |
screen_order | Ekranın flow içindeki sırası. |
is_last_screen | Ekranın gidebileceği başka bir yer kalmadığında true olur. Dallanan bir flow birden fazla farklı ekranda sona erebilir ve her biri true raporlar. |
Bu olayda hem isBackendEvent hem de isCustomerEvent true değerini alır: Adapty saymaya devam eder ve uygulamanız da olayı alır.
Bunlarla ne yapacağınızı öğrenmek için Flow ekran görüntülemelerini izleme sayfasına bakın.
Gözlemci modunda satın almaları yönetme
SDK’yı Gözlemci modunda (observerMode: true) etkinleştirdiyseniz ve Adapty tarafından render edilen bir flow sunarsanız, SDK satın almaları sizin için yapmaz. Bir kullanıcı satın alma veya geri yükleme butonuna dokunduğunda, SDK bunun yerine onObserverPurchaseInitiated veya onObserverRestoreInitiated çağırır. Satın almayı veya geri yüklemeyi kendi kodunuzla gerçekleştirin, flow’un yükleme göstergesini sağlanan callback’lerle yönetin ve ardından işlemi Adapty’ye bildirin.
const unsubscribe = view.setEventHandlers({
onObserverPurchaseInitiated(product, onStartPurchase, onFinishPurchase) {
onStartPurchase(); // show the flow's loading indicator
myPurchaseApi(product.vendorProductId)
.then((transactionId) => adapty.reportTransaction(transactionId))
.finally(() => onFinishPurchase()); // hide the loading indicator
return false; // keep the flow open; dismiss it yourself after success
},
onObserverRestoreInitiated(onStartRestore, onFinishRestore) {
onStartRestore();
myRestoreApi()
.finally(() => onFinishRestore());
return false;
},
});Bu rehber; satın almalar, geri yüklemeler, ürün seçimi ve paywall render işlemleri için olay yönetimini kapsar. Ayrıca buton yönetimini de (paywall’ı kapatma, bağlantı açma vb.) uygulamanız gerekir. Ayrıntılar için buton eylemlerini yönetme rehberimize bakın.
Paywall Builder ile yapılandırılan paywall’lar, satın alma yapmak ve geri yüklemek için ekstra koda ihtiyaç duymaz. Ancak uygulamanızın yanıt verebileceği bazı olaylar üretirler. Bu olaylar; buton tıklamalarını (kapatma butonları, URL’ler, ürün seçimleri vb.) ve paywall üzerinde gerçekleştirilen satın almayla ilgili eylemlere ait bildirimleri içerir. Bu olaylara nasıl yanıt vereceğinizi aşağıda öğrenin.
Bu rehber yalnızca yeni Paywall Builder paywall’ları içindir; bunlar Adapty SDK v3.0 veya sonrasını gerektirir.
Mobil uygulamanızda paywall ekranında gerçekleşen süreçleri kontrol etmek veya izlemek için olay işleyicilerini uygulayın:
Olay örnekleri (Genişletmek için tıklayın)
// onCloseButtonPress
{
//Record the event
}
// onAndroidSystemBack
{
//Record the event
}
// onUrlPress
{
"url": "https://example.com/terms"
}
// onCustomAction
{
"actionId": "login"
}
// onProductSelected
{
"productId": "premium_monthly"
}
// onPurchaseStarted
{
"product": {
"vendorProductId": "premium_monthly",
"localizedTitle": "Premium Monthly",
"localizedDescription": "Premium subscription for 1 month",
"price": {
"amount": 9.99,
"currencyCode": "USD",
"currencySymbol": "$",
"localizedString": "$9.99"
}
}
}
// onPurchaseCompleted - Success
{
"purchaseResult": {
"type": "success",
"profile": {
"accessLevels": {
"premium": {
"id": "premium",
"isActive": true,
"expiresAt": "2024-02-15T10:30:00Z"
}
}
}
},
"product": {
"vendorProductId": "premium_monthly",
"localizedTitle": "Premium Monthly",
"localizedDescription": "Premium subscription for 1 month",
"price": {
"amount": 9.99,
"currencyCode": "USD",
"currencySymbol": "$",
"localizedString": "$9.99"
}
}
}
// onPurchaseCompleted - Cancelled
{
"purchaseResult": {
"type": "user_cancelled"
},
"product": {
"vendorProductId": "premium_monthly",
"localizedTitle": "Premium Monthly",
"localizedDescription": "Premium subscription for 1 month",
"price": {
"amount": 9.99,
"currencyCode": "USD",
"currencySymbol": "$",
"localizedString": "$9.99"
}
}
}
// onPurchaseFailed
{
"error": {
"code": "purchase_failed",
"message": "Purchase failed due to insufficient funds",
"details": {
"underlyingError": "Insufficient funds in account"
}
},
"product": {
"vendorProductId": "premium_monthly",
"localizedTitle": "Premium Monthly",
"localizedDescription": "Premium subscription for 1 month",
"price": {
"amount": 9.99,
"currencyCode": "USD",
"currencySymbol": "$",
"localizedString": "$9.99"
}
}
}
// onRestoreCompleted
{
"profile": {
"accessLevels": {
"premium": {
"id": "premium",
"isActive": true,
"expiresAt": "2024-02-15T10:30:00Z"
}
},
"subscriptions": [
{
"vendorProductId": "premium_monthly",
"isActive": true,
"expiresAt": "2024-02-15T10:30:00Z"
}
]
}
}
// onRestoreFailed
{
"error": {
"code": "restore_failed",
"message": "Purchase restoration failed",
"details": {
"underlyingError": "No previous purchases found"
}
}
}
// onRenderingFailed
{
"error": {
"code": "rendering_failed",
"message": "Failed to render paywall interface",
"details": {
"underlyingError": "Invalid paywall configuration"
}
}
}
// onLoadingProductsFailed
{
"error": {
"code": "products_loading_failed",
"message": "Failed to load products from the server",
"details": {
"underlyingError": "Network timeout"
}
}
}
// onPaywallShown
{
//Record the event
}
// onPaywallClosed
{
//Record the event
}
// onWebPaymentNavigationFinished
{
//Record the event
}İhtiyacınız olan olay işleyicilerini kaydedebilir, ihtiyacınız olmayanları atlayabilirsiniz. Bu durumda, kullanılmayan olay dinleyicileri oluşturulmaz. Zorunlu olay işleyicisi yoktur.
Olay işleyicileri bir boolean döndürür. true döndürülürse, görüntüleme süreci tamamlanmış sayılır; böylece paywall ekranı kapanır ve bu view için olay dinleyicileri kaldırılır.
Bazı olay işleyicilerinin, gerekirse geçersiz kılabileceğiniz bir varsayılan davranışı vardır:
onCloseButtonPress: kapatma butonuna basıldığında paywall’ı kapatır.onUrlPress: tıklanan URL’yi açar ve paywall’ı açık tutar.onAndroidSystemBack(yalnızca modal sunum için): Back butonuna basıldığında paywall’ı kapatır.onRestoreCompleted: başarılı geri yüklemeden sonra paywall’ı kapatır.onPurchaseCompleted: kullanıcı iptal etmediği sürece paywall’ı kapatır.onRenderingFailed: render başarısız olursa paywall’ı kapatır.
Olay işleyicileri
| Olay işleyici | Açıklama |
|---|---|
| onCustomAction | Bir kullanıcı özel bir eylem gerçekleştirdiğinde, örneğin bir özel butona tıkladığında çağrılır. |
| onUrlPress | Bir kullanıcı paywall’ınızdaki bir URL’ye tıkladığında çağrılır. |
| onAndroidSystemBack | Yalnızca modal sunum: Bir kullanıcı Android sistem Back butonuna dokunduğunda çağrılır. |
| onCloseButtonPress | Kapatma butonu görünürken bir kullanıcı ona dokunduğunda çağrılır. Bu işleyicide paywall ekranını kapatmanız önerilir. |
| onPurchaseCompleted | Satın alma tamamlandığında çağrılır; ister başarılı, ister kullanıcı tarafından iptal edilmiş, ister onay bekliyor olsun. Başarılı bir satın alma durumunda güncellenmiş bir AdaptyProfile sağlar. Kullanıcı iptalleri ve bekleyen ödemeler (örneğin ebeveyn onayı gerektiğinde), onPurchaseFailed değil, bu olayı tetikler. |
| onPurchaseStarted | Bir kullanıcı satın alma sürecini başlatmak için “Purchase” eylem butonuna dokunduğunda çağrılır. |
| onPurchaseFailed | Bir satın alma hatalar nedeniyle başarısız olduğunda çağrılır (örneğin ödeme kısıtlamaları, geçersiz ürünler, ağ hataları, işlem doğrulama hataları). Bunun yerine onPurchaseCompleted’ı tetikleyen kullanıcı iptalleri veya bekleyen ödemeler için çağrılmaz. |
| onRestoreStarted | Bir kullanıcı satın alma geri yükleme sürecini başlattığında çağrılır. |
| onRestoreCompleted | Satın alma geri yükleme başarılı olduğunda çağrılır ve güncellenmiş bir AdaptyProfile sağlar. Kullanıcı gerekli accessLevel’a sahipse ekranı kapatmanız önerilir. Nasıl kontrol edileceğini öğrenmek için Abonelik durumu konusuna bakın. |
| onRestoreFailed | Geri yükleme süreci başarısız olduğunda çağrılır ve AdaptyError sağlar. |
| onProductSelected | Paywall view’indeki herhangi bir ürün seçildiğinde çağrılır; böylece kullanıcının satın almadan önce ne seçtiğini izleyebilirsiniz. |
| onRenderingFailed | View render’ı sırasında bir hata oluştuğunda çağrılır ve AdaptyError sağlar. Bu tür hatalar oluşmamalıdır; bir tanesiyle karşılaşırsanız lütfen bize bildirin. |
| onLoadingProductsFailed | Ürün yükleme başarısız olduğunda çağrılır ve AdaptyError sağlar. View oluştururken prefetchProducts: true ayarlamadıysanız, AdaptyUI gerekli nesneleri sunucudan kendisi getirir. |
| onPaywallShown | Paywall kullanıcıya görüntülendiğinde çağrılır. iOS’ta ayrıca, bir kullanıcı bir paywall içindeki web paywall butonuna dokunduğunda ve uygulama içi tarayıcıda bir web paywall açıldığında çağrılır. |
| onPaywallClosed | Yalnızca modal sunum: Paywall kullanıcı tarafından kapatıldığında çağrılır. iOS’ta ayrıca, bir paywall’dan uygulama içi tarayıcıda açılan bir web paywall ekrandan kaybolduğunda çağrılır. |
| onWebPaymentNavigationFinished | Satın alma için bir web paywall açma girişiminden sonra çağrılır; ister başarılı ister başarısız olsun. |