使用javascript从磁条阅读器解析信用卡数据答案

【问题标题】：Parsing Credit Card data from magnetic stripe reader using javascript使用javascript从磁条阅读器解析信用卡数据
【发布时间】：2013-09-26 03:24:42
【问题描述】：

好的，所以我有一个显示如下的 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(); 事件，当它被推送时，java 脚本被启动以将焦点放在Swiped Information 字段上，该字段将存储来自磁条阅读器的数据字符串。

function readCard () {

   document.getElementById('swiped').focus();

}

我的想法是，员工会点击“刷卡”，这将使刷卡信息字段具有焦点，并用字符串填充该字段，然后 javascript 会将这些信息分解成碎片并填写表格因此。

我搜索了高低试图找到一个解决方案，我能找到的最接近的是一个使用 asp.net 作为语言的教程，但我做不到。 PHP 或 JavaScript。提前致谢。

我需要做的就是将那个长字符串分成多个并在 html 表单中显示相应的部分。

附：我不担心表单验证 ATM，在我设法让它填写表单字段后，我会处理它！谢谢！

更新：

我创建了一个 JSFiddle，尽管我输入的 java 脚本似乎不起作用。 http://jsfiddle.net/r8FJX/

更新：

根据下面的 cmets，我添加了一个从读卡器发送到计算机的数据示例。我进去并用随机输入的假数字替换了字符串中的每个数字，并用假数字替换了我的名字。（对不起骗子！）

%B6545461234613451^DOE/JOHN^00000000000000000000000?;6545461234613451=984651465116111?

我假设上面的代码是这样布局的，我找不到任何文档：

%Bcardnumber^lastname/firstname^expDate?;cardnumber=expDate?

【问题讨论】：

你能举一个被刷信用卡数据的例子吗？
@AndyJones 检查我更新的问题！ :)
您还需要让我们知道信用卡的详细信息 - 我们可能可以通过查看卡号和名称来判断 - 但我们几乎无法猜测 CVV 和日期字段是。
“详细信息”是什么意思，我没有发布我的真实信用卡信息
对——当然没问题。但是你刚刚给了我们一堆随机数字——我们如何知道这些数字中的哪些代表日期，哪些代表 CVV，哪些代表信用卡号？如果不通过信用卡读卡器的代码（如果可用），我们就无法知道 - 那么，上面哪个数字是有效的起始日期？有效期是哪一天？这就是我要说的——制造商没有提供任何示例数据吗？

标签： javascript php jquery

【解决方案1】：

选项 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;

【讨论】：

使用选项 1 我在 google chrome 控制台中收到此错误：未捕获的类型错误：对象的属性“长度”不是第 73 行的函数
另外：未捕获的类型错误：无法调用第 65 行未定义的方法“拆分”
我的错，长度是一个属性，而不是一个方法（去掉 ()）
好的，所以我错过了到期日期？
查看我的最新更新 - 抱歉，尝试了这么多 - 一定是晚了 :)

【解决方案2】：

我已成功完成以下到期日期：

exp_date = exp_date.substring(2, 4) + "/" + exp_date.substring(1, 3);

【讨论】：

【解决方案3】：

只为像我这样正在搜索的未来观众。到期需要调整。这将使到期看起来像...... 10/18。不像我得到的 10/81...

下面显示了 ex 的更正格式日期：10/18 而不是 10/81 或 1/1

exp_date = exp_date.substring(2, 4) + "/" + exp_date.substring(0,2);

【讨论】：

【解决方案4】：

（供未来尝试解析 USB 信用卡读卡器数据的人使用）

有两个（有时是 3 个）数据轨道，它们用? 分隔。到期日期在第一条轨道和第二条轨道上重复。如果您想读取足够的数据以向信用卡收费，您可以忽略 Track 2 数据（从; 开始的所有数据）。

CVC 不存储在磁条数据上。您必须在您的支付处理器中禁用 CVC 检查。使用 Stripe，您可以通过 https://dashboard.stripe.com/radar/rules 进行操作。

let parse = readerData => {
    let card = readerData.match(/%B([0-9]+)\^([A-Z /.]+)\/([A-Z /.]*)\^([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 了解更多信息。

我不知道这样做是不是legal。较新的 USB 信用卡读卡器会加密他们读取的数据（您必须将数据发送到他们的 api（并付费）才能解密）。

如果您在使用正则表达式时遇到问题，请尝试使用https://regex101.com/ 对其进行调试。

【讨论】：