Stripe 成功創建沒有卡詳細信息的客戶

Question

在這里完成 web/Stripe 新手。 我構建了一個 iOS 應用程序，但是我想使用的收款方式在 iOS 上是不允許的，所以我不得不為它建立一個網站。

該網站使用 HTML/CSS，節點后端托管在 Heroku 上。 該網站是一個簡單的網站，它獲取用戶的姓名和卡片詳細信息，但目前我的實現存在問題。

在 app.get() 中，我創建了一個客戶和一個 setupIntent，然后當用戶單擊站點上的一個按鈕（只是客戶端 js 中的一個事件監聽器）時，它會被填寫。

我的問題是，當我創建客戶時，每次加載頁面時都會創建一個空客戶。 如果我刪除了這個客戶，加載時不會添加額外的客戶，並且創建了正確的客戶，但是客戶的帳戶沒有附加卡！

我確信這是我的一個基本錯誤，因為我匆忙學習 web 開發以便讓應用程序接受付款（我們收到了應用程序審查團隊的意外拒絕，基本上說我們的應用程序永遠不會被接受為只要它需要應用程序上的卡詳細信息）。

提前感謝您的任何/所有幫助。

干杯!

喬什

服務器端：

const express = require("express");
const bodyParser = require("body-parser");
const ejs = require("ejs");
require('dotenv').config()

const app = express();

app.set('view engine', 'ejs');

app.use(bodyParser.urlencoded({extended: true}));
app.use(express.static("public"));

const Stripe = require('stripe');
const stripe = Stripe(process.env.SECRET_KEY);


app.get('/', async (req, res) => {
  var fullUrl = req.protocol + '://' + req.get('host') + req.originalUrl;
  const customer = await stripe.customers.create({
    email: fullUrl.split('=')[1] //This gets the email sent in the URL from the app
  });
  const intent = await stripe.setupIntents.create({
    customer: customer.id,
    payment_method_types: ['card'],
  });

  console.log(fullUrl)
  console.log(fullUrl.split('=')[1])

  res.render('index', { client_secret: intent.client_secret });
})

app.listen(process.env.PORT || 3000);

客戶端：

var stripe = Stripe('livePublicKeyIsHere');
// const firebase = require("firebase");
// require("firebase/firestore");

var elements = stripe.elements();
var cardElement = elements.create('card');
cardElement.mount('#card-element');
    
var db = firebase.firestore();

var cardholderName = document.getElementById('cardholder-name');
var setupForm = document.getElementById('setup-form');
var clientSecret = setupForm.dataset.secret;


const queryString = window.location.search;
const email = queryString.split('=')[1];

setupForm.addEventListener('submit', function(ev) {
  ev.preventDefault();
  stripe.confirmCardSetup(
    clientSecret, {
      payment_method: {
        card: cardElement,
        billing_details: {
          name: cardholderName.value
        },
      },
    }
  ).then(function(result) {
    if (result.error) {
      console.log("Error!!!" + result.error.message);
      window.alert("There's an error: " + result.error.message);
    } else {
      console.log("Success!!!");
      window.alert("Account created! Download and log into the app in order to continue.");
      addUserToFirestore(email)
    }
  });
});


function addUserToFirestore(email) {
  createUserOnFirestore(email);
  db.collection("Users").doc(email).collection("Settings").doc("info").set({
      cardDetailsAdded: true
    })
    .then(() => {
      console.log("Document successfully written!");
    })
    .catch((error) => {
      console.error("Error writing document: ", error);
    });
}

function createUserOnFirestore(email) {
  db.collection("Users").doc(email).set({
      exists: true
    })
    .then(() => {
      console.log("Document successfully written!");
    })
    .catch((error) => {
      console.error("Error writing document: ", error);
    });
}

Answer 1

原因是因為您使用的是get而不是post 。 當您的用戶單擊該按鈕時，它應該向您的服務器發出POST請求以生成您已經完成的SetupIntent object。 您還應該存儲您的用戶和創建的Customer之間的關系映射，因此當用戶添加新卡時您並不總是創建新Customer ，而是將新卡添加到現有Customer object。

Answer 2

雖然建議使用客戶，但最終可以選擇提供customer （ API ref ）。 您還可以將付款方式單獨附加到客戶，只要您在使用它進行付款之前這樣做。

請注意，除非附加給客戶，否則付款方式僅限一次性使用。