Checout.js
     // This is your test publishable API key.
const stripe = Stripe(key);//公钥
 
// The items the customer wants to buy
const items = [{ id: "xl-tshirt",order_id:order_id }];
 
let elements;
 
initialize();
checkStatus();
 
document
  .querySelector("#payment-form")
  .addEventListener("submit", handleSubmit);
 
// Fetches a payment intent and captures the client secret
async function initialize() {
  const { clientSecret } = await fetch(URL+"/create", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({ items }),
  }).then(res => res.json()) ;
 
  elements = stripe.elements({ clientSecret });


  const paymentElement = elements.create("payment");
  paymentElement.mount("#payment-element");
}
 
async function handleSubmit(e) {
  e.preventDefault();
  setLoading(true);
  console.log(elements);
  const { error } = await stripe.confirmPayment({
    elements,
    confirmParams: {
      // Make sure to change this to your payment completion page
      return_url: base_url+URL+"/successful.html",//成功后，回跳地址
    },
  });
 
  // This point will only be reached if there is an immediate error when
  // confirming the payment. Otherwise, your customer will be redirected to
  // your `return_url`. For some payment methods like iDEAL, your customer will
  // be redirected to an intermediate site first to authorize the payment, then
  // redirected to the `return_url`.
  if (error.type === "card_error" || error.type === "validation_error") {
    showMessage(error.message);
  } else {
    showMessage("An unexpected error occured.");
  }
 
  setLoading(false);
}
 
// Fetches the payment intent status after payment submission
async function checkStatus() {
  const clientSecret = new URLSearchParams(window.location.search).get(
    "payment_intent_client_secret"
  );
 
  if (!clientSecret) {
    return;
  }
 
  const { paymentIntent } = await stripe.retrievePaymentIntent(clientSecret);
 
  switch (paymentIntent.status) {
    case "succeeded":
      showMessage("Payment succeeded!");
      break;
    case "processing":
      showMessage("Your payment is processing.");
      break;
    case "requires_payment_method":
      showMessage("Your payment was not successful, please try again.");
      break;
    default:
      showMessage("Something went wrong.");
      break;
  }
}
 
// ------- UI helpers -------
 
function showMessage(messageText) {
  const messageContainer = document.querySelector("#payment-message");
 
  messageContainer.classList.remove("hidden");
  messageContainer.textContent = messageText;
 
  setTimeout(function () {
    messageContainer.classList.add("hidden");
    messageText.textContent = "";
  }, 4000);
}
 
// Show a spinner on payment submission
function setLoading(isLoading) {
  if (isLoading) {
    // Disable the button and show a spinner
    document.querySelector("#submit").disabled = true;
    document.querySelector("#spinner").classList.remove("hidden");
    document.querySelector("#button-text").classList.add("hidden");
  } else {
    document.querySelector("#submit").disabled = false;
    document.querySelector("#spinner").classList.add("hidden");
    document.querySelector("#button-text").classList.remove("hidden");
  }
}
 
在平台付款可以看到支付信息
 

四，获取支付状态：
webhooks

添加回调地址和事件
charge.succeeded-支付成功后

 
需要密钥
 
五、获取回调信息，控制器
 public function callback()
    {
        $endpoint_secret = '密钥';//;
       
        $payload = @file_get_contents('php://input');
        $sig_header = $_SERVER['HTTP_STRIPE_SIGNATURE'];
        $event = null;
       
        if( $payload){
        try {
          
            $event = \Stripe\Webhook::constructEvent(
                $payload, $sig_header, $endpoint_secret
              );
        }catch(\Stripe\Exception\SignatureVerificationException $e) {
            // Invalid signature
            http_response_code(400);
            exit();
          }
        }
        $log_name = "notify_url.log";
        $this->log_result($log_name, 'pay-start|--'.$event->data->object->paymentIntent.'--|');
 
        // Handle the event
        switch ($event->type) {
            case 'charge.succeeded':
                $paymentIntent = $event->data->object; 
                //$payment=json_decode($paymentIntent);
                $payID=$paymentIntent->payment_intent; 
                $order_no=db('order')->where('transaction_id',$payID)->value('order_no');
                try {
                    $total_money =  $event->amount/100;
                    // 实例化订单模型
                    $model = $this->getOrderModel($order_no, 10);
                    // 订单信息
                    $order = $model->getOrderInfo();
                    if(empty($order)){
                       echo 'Order not exist';
                    }
                    $update_data['transaction_id'] = $payID;
                    $status = $model->onPaySuccess(20, $update_data);
                    $this->log_result($log_name, 'order_no:'.$order_no.'pay|--'.   $paymentIntent->payment_intent.'--|'.'status:'.$status);
                    if ($status == false) {
                        echo $model->getError();
                    }
                } catch (Exception $e) {
                    $this->error('Pay Error!', 'home/member/order');
                    
                    //echo $e . ',支付失败，支付ID【' . $paymentId . '】,支付人ID【' . $PayerID . '】';
                    //exit();
                }
                
                
                break;
            case 'charge.attached':
                $paymentMethod = $event->data->object; 
                $this->log_result($log_name, 'pay-attached|--'.$event->type.'--|');
                break;
            // ... handle other event types
            default:
            $this->log_result($log_name, 'pay-fail|--'.$event->type.'--|');
            echo 'Received unknown event type '.$event->type ;
        }
    
       
 
    }