Question

我正在使用NodeJS with Express（用于API）和Vue（用于UI）构建一个具有定期付款功能的简单SaaS应用程序。我编写了添加客户，链接订阅和计划以及其他一些例程的代码。我们允许用户注册而无需输入付款方式，因此，现在，我需要为用户添加一种添加付款方式的方式。我已经阅读了太多的文档，以至于我的头一直在转动，而Stripe的支持（或缺少它）却无济于事。

我已经尝试了UI中的createSource，createToken和createPaymentMethod的所有内容，然后将其提交给API，在那里我尝试使用从stripeapi.customers.createSource到stripe.paymentMethods.create的所有内容，但没有任何效果。一切都会返回有关对象中缺少的东西或对象不正确的错误。我试图查看支付意图API，但是，仅向客户添加卡似乎有点过头。

这是我最新的代码。

用户界面：创建元素

this.stripe = await loadStripe('pk_test_');
let stripeElem = this.stripe.elements();

this.card = stripeElem.create('card', { hideIcon: true, hidePostalCode: false, style: { base: { color: '#363636', fontSize: '22px', fontSmoothing: 'antialiased' }}});
this.card.mount(this.$refs.card);

用户界面：提交到API

await this.stripe.createSource(this.card, { type: 'card' } ).then((source) => {
  this.$http.post(`/api/route`, source).then((response) => {
    if (response.status === 200) {

    } else {

    }
  }).catch(() => {

  });

API

await stripeapi.customers.createSource(customer_id, { source: card });

这段代码产生了这个对象：

{ source:
   { id: 'src_1HLFsEDfvqoM1TxYXmFvlcK9',
     object: 'source',
     amount: null,
     card:
      { exp_month: 1,
        exp_year: 2022,
        last4: '4242',
        country: 'US',
        brand: 'Visa',
        address_zip_check: 'unchecked',
        cvc_check: 'unchecked',
        funding: 'credit',
        three_d_secure: 'optional',
        name: null,
        address_line1_check: null,
        tokenization_method: null,
        dynamic_last4: null },
     client_secret: 'src_client_secret_VILuqM6ZikLzp9nMq4gizfN8',
     created: 1598653002,
     currency: null,
     flow: 'none',
     livemode: false,
     metadata: {},
     owner:
      { address: [Object],
        email: null,
        name: null,
        phone: null,
        verified_address: null,
        verified_email: null,
        verified_name: null,
        verified_phone: null },
     statement_descriptor: null,
     status: 'chargeable',
     type: 'card',
     usage: 'reusable' } }

此代码和对象会产生此错误：

(node:352976) UnhandledPromiseRejectionWarning: Error: The source hash must include an 'object' key indicating what type of source to create.
    at Function.generate (/data/api/node_modules/stripe/lib/Error.js:39:16)
    at IncomingMessage.res.once (/data/api/docroot/node_modules/stripe/lib/StripeResource.js:190:33)
    at Object.onceWrapper (events.js:286:20)
    at IncomingMessage.emit (events.js:203:15)
    at IncomingMessage.EventEmitter.emit (domain.js:448:20)
    at endReadableNT (_stream_readable.js:1145:12)
    at process._tickCallback (internal/process/next_tick.js:63:19)

我要做的就是获取一个元素，创建一个付款来源/方法（无论它叫什么），然后将其与客户相关联。任何帮助表示赞赏。我看过很多例子，但对我没有任何帮助。一切似乎都会产生关于该对象的错误，或者不是。

Answer 1

NodeJS错误消息显示为：

源哈希必须包含一个“对象”键，指示要创建哪种类型的源。

也可以找到here，但我不确定，如果不是，这是假的错误消息。如果确实适用，则为object: 'card'而不是object: 'source'；但我不这么认为。

使用Stripe有时可以完成一种方法：

source绝对应该是客户端生成的卡令牌，
但是您的客户端没有任何可以对卡进行令牌化的代码。

作为参考，必须将它们组合在一起

Answer 2

经过数小时的开发，我终于弄明白了！严重缺乏API参考，但本文在此处说明了如何做：https://stripe.com/docs/payments/save-card-without-authentication

基本上，您将创建并安装该元素。然后，您在UI中使用createPaymentMethod并将card元素传递给它。从那里，您将paymentMethod.id字符串提交到您的API，然后使用strip.paymentMethods.attach通过传递paymentMethod.id和Stripe客户ID将其附加到客户。

前端HTML

<div ref="card" class="credit-card"></div>

前端创建和挂载

this.stripe = await loadStripe('pk_test_YOURKEY');
let stripeElem = this.stripe.elements();

this.card = stripeElem.create('card', { hideIcon: true, hidePostalCode: false, style: { base: { color: '#363636', fontSize: '22px', fontSmoothing: 'antialiased' }}});
this.card.mount(this.$refs.card);

前端创建付款方式并提交到后端

await this.stripe.createPaymentMethod({ type: 'card', card: this.card }).then((method) => {
  this.$http.post(`/users/billing/cards`, { id: method.paymentMethod.id }).then((response) => {

  }).catch(() => {

  });
}).catch(() => {

});

请注意：此代码并不完整，只是为了给您一个像我一样挣扎的人的例子。

条纹付款使用NodeJS / Vue添加付款来源/卡/方法

2 个答案: