Stripe.js 检测用户对元素字段的更改

Stripe.js detect user changes to element fields

我有一个信息亭应用程序,其中信息亭软件包装了一个注册网站,用户在该过程结束时在该网站上付款。

与许多此类应用程序一样,在一段时间不活动后,需要重定向到起始页面and/or清除用户数据。

由于 stripe.js“元素”支付字段加载到 iFrame 中,我无法检测到更改以及当用户在卡中输入时摸索(尤其是容易对技术感到沮丧的年长用户),系统超时并将他们送回起点,不仅丢失了他们的卡片输入,还丢失了他们所做的所有其他事情。显然这引起了很多仇恨和不满。

解决方案似乎很简单,挂钩到元素的“更改”事件(由 stripe.js 提供),但是,它似乎仅在发生某些主要有效负载更改时触发(即第一个数字或两张卡片,邮政字段中的任何内容,exp 字段中的任何内容,CVV 字段中的任何内容。

有人想出另一个选项来在用户与元素交互时收到通知吗?这似乎是开发人员忽略的常见用例(或者我可能只是没有看到解决方案)。如果它提供其他选项,我将使用 UWP webview 作为我的信息亭应用程序软件。

您尝试过在其他元素上注册事件吗? Stripe 还提供了一组您可以集成的独立元素。

例如,您可以创建一个 cardCvcElement 并注册一个 onChange 侦听器以获得 cvc 输入事件的通知。参见 https://stripe.com/docs/js/element/events/on_change?type=cardCvcElement

看来没有好的答案。我与 Stripe 支持人员进行了交谈,他确认更改事件仅在“有效负载”更改时触发,这是设计的。在这种情况下不是很有帮助。他们的建议是“增加您的超时”(从安全角度来看似乎是合法的,希望尽快清除废弃的信息亭会话中的数据)。如果他们可能会创建另一个在每次击键时都会触发的事件,那就太好了,因为我很确定我不是唯一一个创建过带有支付输入详细信息并需要重置放弃会话的信息亭的人。

最后,我所做的是结合在他们触发的每个更改事件上重置我的计时器,并在倒计时接近结束时设置一个模式,提醒用户他们即将超时并被发送回到开始。这样,如果用户触摸屏幕上的任何位置(关闭模态)或模态上的按钮,我可以触发一个事件来重置我的信息亭计时器 - 允许他们继续。

在这两件事之间,我认为这是一个半途而废的解决方案(尽管很烦人)。