Итак, у меня есть html-форма, которая отображается так:
<span style='required'>*</span> - Indicates required field. <div class='fields'>Swiped Information</div> <input type=text name='swiped' id='swiped'> </div> <div class='fields'>First Name</div> <input type=text name='first_name' id='first_name'><span style='required'>*</span> </div> <div class='fields'>Last Name</div> <input type=text name='last_name' id='last_name'><span style='required'>*</span> </div> <div class='fields'>Expiration</div> <input type=text size=8 name='expiration' id='expiration'><span style='required'>*</span>(MMYY) </div> <div class='fields'>CVV Code</div> <input type=text size=8 name='cvv' id='cvv'><span style='required'>*</span> </div> <div class='fields'>Credit Card Number</div> <input type=text name='card' id='card'><span style='required'>*</span> </div> <hr> <div class='buttons'></div> <a onclick="readCard();" style="cursor:pointer; color:red;">Swipe Credit Card</a> </div>
Мои знания такого рода материала очень бедны. У меня есть базовый маленький считыватель кредитных карт, который подключается к компьютеру через USB. Я хочу, чтобы иметь возможность пронести по кредитной карте и мой сайт анализировать информацию в поля формы, которые выше.
Я добавил onclick=readCard();
событие к ссылке ниже моей формы, и когда это Swiped Information
java-скрипт, чтобы сосредоточиться на поле Swiped Information
которое будет хранить строку данных из считывателя магнитной полосы.
function readCard () { document.getElementById('swiped').focus(); }
Мои мысли будут заключаться в том, что сотрудник ударил бы «Swipe Credit Card», который заставил бы поле «Информация о шапке карты» сфокусироваться и заполнил бы это поле строкой, а затем javascript разбил бы эту информацию на части и заполнил бы форму соответственно.
Я искал высокий и низкий, чтобы попытаться найти решение, и ближе всего я мог прийти, это учебник, который использовал asp.net как язык, и я не могу этого сделать. Либо PHP, либо JavaScript. Заранее спасибо.
Все, что мне нужно сделать, это разбить эту длинную строку на несколько и отобразить соответствующие части в форме html.
PS Я не беспокоюсь о банкомате проверки формы, я буду заботиться об этом после того, как мне удастся заполнить поля формы! Благодаря!
ОБНОВИТЬ:
Я создал JSFiddle, хотя java-скрипт, который я вставлял, кажется, не работает. http://jsfiddle.net/r8FJX/
ОБНОВИТЬ:
Согласно приведенным ниже комментариям, я добавил пример данных, отправленных с моего устройства чтения карт на компьютер. Я вошел и заменил каждое число в строке произвольно напечатанными поддельными номерами и заменил мое имя фальшивым. (Извините, мошенники!)
%B6545461234613451^DOE/JOHN^00000000000000000000000?;6545461234613451=984651465116111?
Я предполагаю, что, как выложенный выше код, я не могу найти никакой документации:
%Bcardnumber^lastname/firstname^expDate?;cardnumber=expDate?
Опция 1)
var card_data = "%B6545461234613451^DOE/JOHN^00000000000000000000000?;6545461234613451=984651465116111?" var details1 = card_data.split("^"); var card_number = details1[0]; card_number = card_number.substring(2); var names = details1[1].split("/"); var first_name = names[1]; var last_name = names[0]; var details2 = details1[2].split(";"); details2 = details2[1].split("="); var exp_date = details2[1]; exp_date = exp_date.substring(0, exp_date.length - 1); exp_date = exp_date.substring(2, 3) + "/" + exp_date.substring(0,1);
Вариант 2)
var pattern=new RegExp("^\%B(\d+)\^(\w+)\/(\w+)\^\d+\?;\d+=(\d\d)(\d\d)\d+$"); var match = pattern.exec(card_data); card_number = match[1]; first_name = match[3]; last_name = match[2]; exp_date = match[5] + "/" + match[4];
Затем выполните:
document.getElementById("first_name").value = first_name; document.getElementById("last_name").value = last_name; document.getElementById("card").value = card_number; document.getElementById("expiry").value = exp_date;
У меня был успех с указанием даты истечения срока действия:
exp_date = exp_date.substring (2, 4) + "/" + exp_date.substring (1, 3);
Только для будущих зрителей, таких как я, которые искали. Срок действия должен быть скорректирован. Это сделает истечение срока действия … 10/18. Не 10/81, как я получал …
Ниже приведена скорректированная отформатированная дата: 10/18 не 10/81 или 1/1
exp_date = exp_date.substring(2, 4) + "/" + exp_date.substring(0,2);
(Для будущих людей, пытающихся разобрать данные для чтения кредитных карт USB)
Есть два (иногда 3) трека данных, они разделены ?
, Дата истечения срока действия дублируется на первом треке и втором треке. Если вы хотите прочитать достаточное количество данных для оплаты кредитной карты, вы можете игнорировать данные Track 2 (все, начиная от и дальше).
CVC не хранится в данных магнитной полосы. Вам придется отключить проверку CVC в вашем платежном процессоре. С помощью Stripe вы можете сделать это на https://dashboard.stripe.com/radar/rules .
let parse = readerData => { let card = readerData.match(/%B([0-9]+)\^([AZ /.]+)\/([AZ /.]*)\^([0-9]{2})([0-9]{2})/); let lastName = card[2].trim(); // 'LASTNAME/FIRSTNAME.MR' is possible let firstName = card[3].trim().split('.')[0]; let fullName = `${firstName} ${lastName}`; return { exp_month: card[5], exp_year: card[4], number: card[1], name: fullName, }; } parse('%B6545461234613451^DOE/JOHN^21040000000000000000000?;this part does not matter') // {exp_month: "04", exp_year: "21", number: "6545461234613451", name: "JOHN DOE"}
Если вы используете Stripe.js v2, вы можете передать объект, возвращенный parse()
прямо на Stripe.card.createToken()
.
Я видел LASTNAME/FIRSTNAME MIDDLENAME
в образце данных, этот код должен превратить это в FIRST MIDDLE LAST
.
Прочтите https://en.wikipedia.org/wiki/Magnetic_stripe_card#Financial_cards для получения дополнительной информации.
Я не знаю, законно ли это. Новые считыватели кредитных карт USB шифруют данные, которые они читают (вам нужно отправить данные в их api (и оплатить их), чтобы расшифровать их).
Если у вас возникли проблемы с регулярным выражением, попробуйте https://regex101.com/ для его отладки.