如何将 Stripe 支付网关集成到 MVC ASP.NET



我想将 Stripe psp 集成到我的 ASP.NET MVC 应用程序中。

在你用寻找具有相同问题的问题来烤我之前,我确实寻找了上述问题,但它们似乎已经过时了。

我试图按照条纹网站上的程序进行操作,但 javascript 无法加载付款。 我知道我错过了什么。

如果你能帮助我而不是烤我,那就太好了:).
p.s我对 MVC 完全陌生:/

带有脚本的 cshtml 视图

@{
Layout = null;
}

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>ProcessPayment | Merchant Dashboard</title>
<script src="https://js.stripe.com/v3/"></script>
<script>
var stripe = Stripe('pk_test_51H1XOgCuKWbkvTE3V6VYOV0qVBLrEcZMCISGPWJ3nZeDqq3JgWb1GL1c2HRxk4NAve4j7YFkZeAvWoatocuvgzLb00bSZL72k3');
var elements = stripe.elements();
// Custom styling can be passed to options when creating an Element.
var style = {
base: {
// Add your base input styles here. For example:
fontSize: '16px',
color: '#32325d',
},
};
// Create an instance of the card Element.
var card = elements.create('card', { style: style });
// Add an instance of the card Element into the `card-element` <div>.
card.mount('#card-element');
// Create a token or display an error when the form is submitted.
var form = document.getElementById('payment-form');
form.addEventListener('submit', function (event) {
event.preventDefault();
stripe.createToken(card).then(function (result) {
if (result.error) {
// Inform the customer that there was an error.
var errorElement = document.getElementById('card-errors');
errorElement.textContent = result.error.message;
} else {
// Send the token to your server.
stripeTokenHandler(result.token);
}
});
});
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();
}
// Set your secret key. Remember to switch to your live secret key in production!
// See your keys here: https://dashboard.stripe.com/account/apikeys
StripeConfiguration.ApiKey = "pk_test_51H1XOgCuKWbkvTE3V6VYOV0qVBLrEcZMCISGPWJ3nZeDqq3JgWb1GL1c2HRxk4NAve4j7YFkZeAvWoatocuvgzLb00bSZL72k3";
// Token is created using Checkout or Elements!
// Get the payment token submitted by the form:
var token = model.Token; // Using ASP.NET MVC
var options = new ChargeCreateOptions
{
Amount = 999,
Currency = "usd",
Description = "Example charge",
Source = token,
};
var service = new ChargeService();
var charge = service.Create(options);
</script>
</head>
<body>
<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 Element errors. -->
<div id="card-errors" role="alert"></div>
</div>
<button>Submit Payment</button>
</form>
</body>
</html>

控制器

using System;
using System.Collections.Generic;
using System.Configuration;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MerchantCheckout.Models;
using Stripe;
namespace MerchantCheckout.Controllers
{
public class ProcessPaymentController : Controller
{
// GET: ProcessPayment
public ActionResult Index()
{
return View();
}
public ActionResult ProcessPayment()
{
var stripePublishKey = ConfigurationManager.AppSettings["pk_test_51H1XOgCuKWbkvTE3V6VYOV0qVBLrEcZMCISGPWJ3nZeDqq3JgWb1GL1c2HRxk4NAve4j7YFkZeAvWoatocuvgzLb00bSZL72k3"];
ViewBag.StripePublishKey = stripePublishKey;
return View();
}
public ActionResult Charge(string stripeEmail, string stripeToken)
{
Stripe.CustomerCreateOptions customer = new Stripe.CustomerCreateOptions();
var custService = new Stripe.CustomerService();
Stripe.Customer stpCustomer = custService.Create(customer);
return View();
}
}
}

好吧,我设法让它:)工作。 对于像我这样被卡住的任何人,请按照以下步骤操作:

第 1 步:从 stripe 获取密钥后,将其添加到您的 web.config 文件中

<add key="stripePublishableKey" value="YourKeyHere"/>

注意:我添加仅用于测试目的。 稍后,您可以在应用上线时添加密钥。

步骤 2:在控制器中添加以下代码

public ActionResult Index()
{
ViewBag.StripePublishKey = ConfigurationManager.AppSettings["stripePublishableKey"];
return View();
}

[HttpPost]
public ActionResult Charge(string stripeToken, string stripeEmail)
{
Stripe.StripeConfiguration.SetApiKey("your Publishable key");
Stripe.StripeConfiguration.ApiKey = "your Secret key";

var myCharge = new Stripe.ChargeCreateOptions();
// always set these properties
myCharge.Amount = 500;
myCharge.Currency = "USD";
myCharge.ReceiptEmail = stripeEmail;
myCharge.Description = "Sample Charge";
myCharge.Source = stripeToken;
myCharge.Capture = true;
var chargeService = new Stripe.ChargeService();
Charge stripeCharge = chargeService.Create(myCharge);
return View();
}

步骤 3:验证您的 cshtml 文件是否包含以下代码,如果没有,请添加它们:

<form action="/Home/Charge" method="POST">
<article>
<label>Amount: $5.00</label>
</article>
<script src="//checkout.stripe.com/v2/checkout.js"
class="stripe-button"
data-key="@ViewBag.StripePublishKey"
data-locale="auto"
data-description="Sample Charge"
data-amount="500">
</script>
</form>

第 4 步:测试!!但是,您应该使用条带测试数据。

我不拥有上述代码,做了一些研究,并发现了这个网站,这个人解释了它是如何完成的。点击这里

条纹集成非常简单。
Stripe 为支付网关集成提供了非常有用的文档。我们可以遵循相同的
对于新用户,重要的是要了解如何集成支付网关 进入我们的应用程序。

注意:在开始任何开发之前,首先准备好可发布的密钥和秘密密钥。注册或登录 Stripe 账户并从那里获取这些密钥。

当我第一次在我的应用程序中使用 Stripe 时,我点击了以下链接

  1. 转到 https://stripe.com/docs/payments/integration-builder
  2. 选择语言 .NET
  3. 选择预构建结帐页面/自定义付款流程

要进行快速测试,我建议使用预构建结帐页面。 一旦您有信心,您就可以继续自定义付款流程。

要与.NET Core MVC应用程序集成,您可以参考github项目:
https://github.com/rohitsoftt/stripe-payment-gateway-dot-net-core
您需要在 appsettings.json 文件中更新密钥

最新更新