Реализация плагина Cordova Card.IO

У меня возникли проблемы с реализацией плагина Card.io для Cordova. На странице github есть инструкции по установке и реализации плагина: https://github.com/card-io/card.io-Cordova-Plugin

Я добавил погружение, выполнив

$ cordova plugin add https:///...

И добавили кнопку, которую вам советуют добавить на страницу github. До этого момента я почти уверен, что делаю все так, как должен. Теперь возникает проблема, фактическая реализация в приложении. Я использую инфраструктуру пользовательского интерфейса в своем приложении, и поэтому у меня нет файла index.js, и мой код не похож на код в стандартном index.js в отношении обработки deviceReady. Я просто делаю...

.ready(function() {
    // Code to fire on device ready.
}):

Я немного знаком с обратными вызовами, но понятия не имею, что происходит в их примере. весь "пример: function() {..." для меня совершенно новый.

Может ли кто-нибудь переписать этот пример, чтобы он состоял из нескольких функций, которые были хорошо структурированы и имели немного больше смысла?

Я попытался сделать это, и теперь мой код выглядит так:

   .ready(function() {
        CardIO.canScan(onCardIOCheck);
    });

    function onCardIOComplete() {
        var cardIOResponseFields = [
            "cardType",
            "redactedCardNumber",
            "cardNumber",
            "expiryMonth",
            "expiryYear",
            "cvv",
            "postalCode"
        ];

        var len = cardIOResponseFields.length;
        alert("card.io scan complete");
        for (var i = 0; i < len; i++) {
            var field = cardIOResponseFields[i];
            alert(field + ": " + response[field]);
        }
    }

    function onCardIOCancel() {
        alert("card.io scan cancelled");
    }

    function onCardIOCheck(canScan) {
        alert("card.io canScan? " + canScan);
        var scanBtn = document.getElementById("scanBtn");
        if (!canScan) {
          scanBtn.innerHTML = "Manual entry";
        }

        scanBtn.addEventListener("click", function(e) {
            var options = {
                "requireExpiry": true,
                "requireCVV": false,
                "requirePostalCode": false,
                "restrictPostalCodeToNumericOnly": true
            };
            CardIO.scan(options, onCardIOComplete, onCardIOCancel);
        });
      }

Однако это не работает. Я добавил alert() с обеих сторон вызова внутри функции .ready(), чтобы увидеть, срабатывает ли он. Оба срабатывают, но функция Card.canScan() как будто вообще не срабатывает. Я также добавил alert() внутри функции onCardIOCheck, чтобы увидеть, достигнута ли она когда-либо, но это не так.

Любая помощь будет принята с благодарностью.

(Обратите внимание: я не использую Angular.js, я использую только чистый Javascript и иногда jQuery)


cordova plugins card.io
person user1840352    schedule 24.09.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Вам нужно заменить

.ready(function() {
    CardIO.canScan(onCardIOCheck);
});

С

document.addEventListener('deviceready', function() {
    CardIO.canScan(onCardIOCheck);
}, false);

Событие готовности, которое вы использовали, — это событие готовности DOM, а не плагинов Cordova. Я считаю, что когда вы вызвали CardIO.canScan(onCardIOCheck);, плагин не был загружен и поэтому он не работал.

person e666    schedule 25.09.2016
comment
Спасибо, я попробовал ваше решение. Помогает, но не совсем работает. Это помогает в том, что Card.io теперь работает правильно. Однако он запускает функцию canScan, но обратный вызов не срабатывает. Что делает его еще более странным, так это то, что когда я помещаю приложение в фоновый режим и возвращаюсь к нему, обратный вызов срабатывает со статусом true, что положительно. Но почему он срабатывает только тогда, когда приложение находится в фоновом режиме. Затем, когда я нажимаю кнопку, ничего не происходит, но снова, когда я помещаю приложение в фоновый режим, оно вызывает интерфейс Card.io. Интерфейс снова работает только в фоновом режиме. Мысли? - person user1840352; 26.09.2016