使用javascript和php单击按钮时如何创建条带产品

Posted 2023-03-21

【中文标题】使用javascript和php单击按钮时如何创建条带产品

【英文标题】：How to create stripe product when click button using javascript and php

【发布时间】：2021-11-24 23:14:43

【问题描述】：

我正在使用 php 代码在我的产品仪表板中创建产品，如下所示：

\Stripe\Stripe::setApiKey('sk_test_51JxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxJhn');
$product = \Stripe\Product::create([
  'name' => 'test',
]);

所以我在这里尝试做的是，每当我点击提交按钮时，我必须在我的条带仪表板上创建产品：

   <button id="submit-button" type="submit"  class="btn btn-primary" >Submit</button>
<script>
const btn = document.getElementById("submit-button");
btn.addEventListener("click", e => 
               e.preventDefault();
<?php
\Stripe\Stripe::setApiKey('sk_test_51JxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxJhn');
$product = \Stripe\Product::create([
  'name' => 'test',
]);
?>

               )



    </script>

但是，每当重新加载页面时，它都会创建产品。我只希望在单击按钮时创建产品！

【问题讨论】：

您不能直接从 JS 运行 PHP，因为 JS 在客户端运行，而 PHP 在服务器端运行。然而，这可以通过发出 http 请求来实现。一些不错的选择是fetch 或XMLHttpRequest。如果你想使用jQuery，有Ajax

@Reyno 在我的情况下我该怎么做？

【参考方案1】：

现在，只要带有按钮的页面加载，您的 PHP 代码就会运行，因为按钮代码和 PHP 代码都在同一个位置，并且您没有任何逻辑来阻止产品创建代码运行。您可能希望将两者分开。

例如，在button.php 你可能有这样的东西：

<a href="create-product.php">Create Product</a>

然后在create-product.php 中，您将拥有创建产品的代码。

您可以使用 javascript 来执行此操作，而无需导航到另一个页面，如下所示：

<button id="submit-button" type="button" class="btn btn-primary">Submit</button>

<script>
const btn = document.getElementById("submit-button");
btn.addEventListener("click", e => 
  e.preventDefault();
  fetch('create-product.php').then( /* Handle response */ );
);
</script>

在此示例中，创建产品的代码也将位于单独的文件中。请参阅MDN's Fetch Usage Guide 了解更多信息。