Подключить устройство для чтения кредитных карт к веб-приложению?

Есть ли способ подключить устройство чтения карт к моему веб-приложению (javascript), чтобы пользователю не приходилось вручную вводить информацию о кредитной карте?

Это веб-приложение предназначено для покупки продуктов в магазине. Пользователь нажимает на то, какие предметы он хочет купить, а затем он берет кредитную карту в читатель и получает квитанцию.

Ответы

Ответ 2

Собственно, это возможно из-за того, что простые устройства чтения карт USB действуют как устройства ввода с клавиатуры. Поскольку он действует как ввод на клавиатуре, как только входной ящик находится в фокусе, вы можете пронести карту, надавить на скрытое поле, используя некоторые изящные jQuery и т.д., А затем обработать их оттуда.

Пожалуйста, см. мой ответ на этот вопрос, с которым связан Марис.

EDIT: 2/2016

Я создал GitHub Gist с очень простой реализацией jQuery.

Ответ 3

Как упоминается в другом ответе, сканер штрих-кода или устройство чтения карт работают как клавиатура. Вы можете присоединить слушателя, например, во всем документе:

document.onkeypress = function(e) {
    e = e || window.event;
    var charCode = (typeof e.which == "number") ? e.which : e.keyCode;
    // store it , in this example, i use localstorage
    if(localStorage.getItem("card") && localStorage.getItem("card") != 'null') {
        // append on every keypress
        localStorage.setItem("card", localStorage.getItem("card") + String.fromCharCode(charCode));
    } else {
        // remove localstorage if it takes 300 ms (you can set it)
        localStorage.setItem("card", String.fromCharCode(charCode));
        setTimeout(function() {
            localStorage.removeItem("card");
        }, 300);
    }
    // when reach on certain length within 300 ms, it is not typed by a human being 
    if(localStorage.getItem("card").length == 8) {
        // do some validation
        if(passedonvalidation){
            // do some action
        }
    }
}

Вы можете подключить прослушиватель в текстовом поле, если хотите. Убедитесь, что он сфокусирован, когда карта пробита.

Ответ 4

Вот как это работает, я думаю. Кредитная карта предоставит вам часть программного обеспечения, которое вы устанавливаете на свой компьютер. Это программное обеспечение предоставляет услугу на локальном порту.

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

После чего терминал кредитной карты обработает зарядку и либо вернет ссылочный номер при успешном завершении, либо сообщение об ошибке.

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