khegay
@khegay
Founder, Garuna

Как отловить событие нативного модального окна с авторизацией в cordova-plugin-purchase?

Проблема такая:
Когда пользователь открывает страницу подписки, всплывает нативное модальное окно эпла - в которое нужно ввести icloud/itunes connect логин и пароль. Неважное, какое действие совершает пользователь: вводит, либо отменяет, плагин не отлавливает это событие и на странице подвисает бесконечная загрузка. И кнопка покупки не появляется.
Из-за этого, приложение постоянно отклоняется с причиной: app loaded indefinitely in the subscription page

Окружение:

Ionic 5.1.1
Capacitor 2.3.0
Device: iPhone 6S iOS 13.5.1
cordova-plugin-purchase: 10.2.0


Инициализация приложения:
app.component.ts
this.platform.ready().then(() => {
    this.registerProducts()
 })

registerProducts() {
    this.store.register([
        {
            id: 'premium1',
            alias: 'premium',
            type: this.store.PAID_SUBSCRIPTION,
        },
        {
            id: 'product1',
            alias: 'product1',
            type: this.store.CONSUMABLE,
        },
        {
            id: 'product2',
            alias: 'product2',
            type: this.store.CONSUMABLE,
        },
    ])
    this.store.refresh()
}


Главная страница (первая при запуске приложения):
home.ts
this.platform.ready().then(() => {
    let m = this.store.get('premium')
        if (!m.owned) {
            this.setPremium(false)
            this.cdref.detectChanges() // Angular ChangeDetectorRef
        }
})


Страница подписки:
page.ts
this.platform.ready().then(() => {
    this.registerProducts()
    this.setupListeners()
    this.store.update()
 })

registerProducts() {
    let product = this.store.get('premium')
    
    if (!product) {
        this.loading = false
        this.productError = true
    } else if (product.state === this.store.INVALID) {
        this.loading = false
        this.productError = true
    } else {
        this.loading = false
        this.product = product
    }

    this.cdref.detectChanges()
}

setupListeners() {
    this.store.when('premium')
        .error(e => {
            this.dissmissAlert()
            this.presentAlert(e.code, e.message)
        })
        .finished(() => {
            this.loading = false
            this.restoreLoading = false
        })
        .expired(() => {
            this.loading = false
            this.productError = true
        })
        .approved((p: IAPProduct) => {
            p.verify()
            this.cdref.detectChanges()
        })
        .verified((p: IAPProduct) => {
            this.setPremium(true)
            p.finish()
            this.cdref.detectChanges()
        })
}

purchase() {
    this.btnLoading = true
    
    try {
        this.store.order('premium').then(() => {
            this.btnLoading = false
        }).catch((err) => {
            this.presentAlert('', err)
        })
    } catch (error) {
        this.presentAlert('', error)
    }
}

restore() {
        this.restoreLoading = true
        this.store.refresh()
        this.cdref.detectChanges()
}

page.html
<ng-container *ngIf="productError">
    <div class="wait">
            <span class="text">Error with Subcription. Try again later.</span>
    </div>
</ng-container>

 <ng-container *ngIf="!productError">
    <ng-container *ngIf="loading">
        <div class="wait">
            <span class="text">Loading...</span>
            <ion-spinner class="spinner" name="crescent"></ion-spinner>
        </div>
    </ng-container>

    <ng-container *ngIf="!loading">
        <p class="act" *ngIf="product.owned">Subscribed</p>

        <button class="sub-btn" (click)="purchase()" *ngIf="!product.owned">
            <ion-spinner class="spinner" name="crescent" *ngIf="btnLoading"></ion-spinner>

            <ng-container *ngIf="!btnLoading">
                <span class="text">Subscribe {{ product.price }} / {{ product.billingPeriod }} мес.</span>
                <ion-icon class="icon" name="arrow-forward-circle" slot="end"></ion-icon>
            </ng-container>
        </button>
    </ng-container>
</ng-container>
  • Вопрос задан
  • 38 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы