檢索令牌/創建收費 - 條紋

Question

這可能是一個愚蠢的問題，但我們現在就去。 我已經設置了條紋元素（https://stripe.com/docs/elements）以收集信用卡信息並對其進行確認。 現在我試圖設置費用，但我不確定如何設置我的「服務器端」代碼。

提交表單在我controller.js：

function stripeTokenHandler(token) { 
// Insert the token ID into the form so it gets submitted to the server 
var form = document.getElementById('payment-form'); 
var hiddenInput = document.createElement('input'); 
hiddenInput.setAttribute('type', 'hidden'); 
hiddenInput.setAttribute('name', 'stripeToken'); 
hiddenInput.setAttribute('value', token.id); 
form.appendChild(hiddenInput); 

// Submit the form 
form.submit(); 
} 

https://stripe.com/docs/charges： 「在您的服務器，搶提交的表單中的POST參數的條紋標誌。」

從我Nodecharge.js：

// Set your secret key: remember to change this to your live secret key in 
production 
// See your keys here: https://dashboard.stripe.com/account/apikeys 
var stripe = require("stripe")("sk_test_111111111111111111"); 

// Token is created using Stripe.js or Checkout! 
// Get the payment token ID submitted by the form: 
var token = request.body.stripeToken; // Using Express 

// Charge the user's card: 
stripe.charges.create({ 
amount: 1000, 
currency: "sek", 
description: "Example charge", 
source: token, 
}, function(err, charge) { 
// asynchronously called 
}); 

我的HTML表單：

<form action="/charge" method="post" id="payment-form"> 
    <div class="form-row"> 
     <label for="card-element"> 
     Credit or debit card 
     </label> 
     <div id="card-element"> 
     <!-- a Stripe Element will be inserted here. --> 
     </div> 

      <!-- Used to display form errors --> 
      <div id="card-errors" role="alert"></div> 
    </div> 

    <button>Submit Payment</button> 
</form> 

提交與測試卡的支付，我重定向到/荷與404 我這個新的，我明顯複製/粘貼了一些代碼，但我努力想把它包裹起來，我想理解它，而不是讓它工作。 我有點得到信用卡信息檢索如何與js協同工作，但是當涉及到收費/重定向/ 404 /時，我有點困惑。
我的意思是，這個行動路線指向我的一個不存在的頁面，對嗎？我是否需要創建此頁面？

<form action="/charge" method="post" id="payment-form"> 

對不起，這篇文章的長度，請幫我明白是怎麼回事，或者我需要解決什麼。

感謝任何幫助。

Answer 1

你是如何爲後端服務--- Express？

如果你看到一個404當您提交表單/charge這聽起來像你可能沒有一個app.post路線設置爲快速/charge。

您可以通過引導上更詳細一點 https://expressjs.com/en/guide/routing.html

路由閱讀如果你想看到一個簡單的工作示例，來看看這個（確保更換pk_test和sk_test與您的實際測試鍵）：

var stripe = require("stripe")("sk_test_xxxyyyzzz"); 
var express = require('express'), bodyParser = require('body-parser'); 

var urlencodedParser = bodyParser.urlencoded({ extended: false }) 
var app = express(); 

app.get('/',function(req, res) { 
    // for kicks, just sending checkout 
    res.send('<form action="/charge" method="POST">Buy it !<script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key="pk_test_xxxyyyyzzzz"></script></form>') 
}); 

app.post('/charge',urlencodedParser, function(req, res) { 

    // grab a token 
    var token = req.body.stripeToken; 

    // creating a charge, for real use add things like error handling 
    stripe.charges.create({ 
    amount: 2000, 
    currency: "usd", 
    source: token, // obtained with Stripe.js 
    description: "Charge" 
    }, function(err, charge) { 
    res.send("You made a charge: "+ charge.id); 
    }); 
}); 

app.listen(5000)