使用Jquery AJAX进行Stripe支付?(仅限Javascript)

Make a Stripe payment with Jquery AJAX? (Javascript ONLY)

本文关键字:仅限 Javascript 支付 Jquery AJAX 进行 Stripe 使用      更新时间:2023-09-26

我正在尝试为Stripe制作一个自定义的支付表单,我想手动对Stripe进行AJAX调用。(而不是提交事件(

然而,首先我很确定我把它贴错了地方。但我不知道我应该向哪个URL发出这个帖子请求。

如果我使用的是正确的网址。我收到405 not allowed响应。没有关于我的请求有什么问题的信息。

我得到的是:

Stripe.setPublishableKey('pk_test_12345');
    Stripe.card.createToken({
      number: ccNum,
      cvc: ccCVC,
      exp_month: ccMonth,
      exp_year: ccYear
    }, stripeResponseHandler);

这部分工作得很好,给了我200 OK的状态,我从服务器上得到了一个令牌。

function stripeResponseHandler(status, response) {
      console.log('card status: ', status);
      console.log('token: ', response.id);
      $.ajax({
        type: 'POST',
        url: 'https://checkout.stripe.com/checkout.js',
        headers: {
          stripeToken: response.id
        },
        data: {
          number: ccNum,
          cvc: ccCVC,
          exp_month: ccMonth,
          exp_year: ccYear
        },
        success: (response) => {
          console.log('successful payment: ', response);
        },
        error: (response) => {
          console.log('error payment: ', response);
        }
      })
    }

然而,这给了我405不允许。对我来说,端点是一个.js文件似乎有点奇怪。这就是为什么我认为我得到了错误的网址。

有人能帮我想出如何手动申请Stripe付款吗?

免责声明:这是有效的,但这是可怕的做法。不要将此用于实际项目。我需要它作为一个仅限前端的测试环境。正如本页面上的其他用户所指出的,您应该在后端进行此操作!

我终于在以下网站上找到了一些有用的文档:https://stripe.com/docs/api#create_charge

因为我怀疑我使用的URL是错误的。

在获得正确的URL后,以下ajax调用工作:

希望这也能帮助其他人!大多数答案都是PHP或其他后端语言。

$.ajax({
        type: 'POST',
        url: 'https://api.stripe.com/v1/charges',
        headers: {
          Authorization: 'Bearer sk_test_YourSecretKeyHere'
        },
        data: {
          amount: 3000,
          currency: 'usd',
          source: response.id,
          description: "Charge for madison.garcia@example.com"
        },
        success: (response) => {
          console.log('successful payment: ', response);
        },
        error: (response) => {
          console.log('error payment: ', response);
        }
      })

EDIT:这是不安全的(而且已经过时了(!您不应该将用户的卡信息直接发送到自己的服务器。相反,您应该直接将其发送给Stripe。这里有一个最新的(使用意图等(示例


您需要将POST $.ajax()函数中的一个PHP文件:

  $.ajax({
    type: 'POST',
    url: './stripe-payment.php',
    headers: {
      stripeToken: response.id
    },
    data: {
      number: ccNum,
      cvc: ccCVC,
      exp_month: ccMonth,
      exp_year: ccYear
    },
    success: (response) => {
      console.log('successful payment: ', response);
    },
    error: (response) => {
      console.log('error payment: ', response);
    }
  })

您的PHP应该有类似Stripe PHP绑定require()d的东西来使用Stripe支付API,并且该PHP文件应该看起来像这样,来自这个SO问题:

<?php
require_once('Stripe.php');
// Set your secret key: remember to change this to your live secret key in production
// See your keys here https://manage.stripe.com/account
Stripe::setApiKey("sk_test_APIKEYREDACTED");
// Get the credit card details submitted by the form
$token = json_decode($_POST['chargeData']);
$tokenid = $token['id'];
// Create the charge on Stripe's servers - this will charge the user's card
try {
$charge = Stripe_Charge::create(array(
  "amount" => 2000, // amount in cents, again
  "currency" => "usd",
  "card" => $tokenid,
  "description" => "payinguser@example.com")
);
echo 'success';
} catch(Stripe_CardError $e) {
  // The card has been declined
    echo $tokenid;
}
?>

有关更多信息,请参阅Github的自述文件,以及Stripe文档。