快捷導(dǎo)航

Node.js 實(shí)現(xiàn) Stripe 支付的實(shí)現(xiàn)方法

更新時(shí)間：2025年11月17日 09:21:56 作者：明金同學(xué)

本文介紹了使用Stripe支付系統(tǒng)的實(shí)現(xiàn)方法,本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧

1. 安裝依賴

npm install stripe express

2. 基礎(chǔ)服務(wù)端實(shí)現(xiàn)

// server.js
const express = require('express');
const stripe = require('stripe')('你的_STRIPE_SECRET_KEY'); // 從 Stripe 控制臺(tái)獲取
const app = express();
app.use(express.json());
app.use(express.static('public'));
// 創(chuàng)建支付意圖
app.post('/create-payment-intent', async (req, res) => {
  try {
    const { amount, currency = 'usd' } = req.body;
    // 創(chuàng)建 PaymentIntent
    const paymentIntent = await stripe.paymentIntents.create({
      amount: amount, // 金額（以最小單位計(jì)，如美分）
      currency: currency,
      automatic_payment_methods: {
        enabled: true,
      },
    });
    res.json({
      clientSecret: paymentIntent.client_secret
    });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});
// 創(chuàng)建 Checkout Session（更簡(jiǎn)單的方式）
app.post('/create-checkout-session', async (req, res) => {
  try {
    const session = await stripe.checkout.sessions.create({
      payment_method_types: ['card'],
      line_items: [
        {
          price_data: {
            currency: 'usd',
            product_data: {
              name: '商品名稱',
            },
            unit_amount: 2000, // $20.00
          },
          quantity: 1,
        },
      ],
      mode: 'payment',
      success_url: 'http://localhost:3000/success',
      cancel_url: 'http://localhost:3000/cancel',
    });
    res.json({ id: session.id });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});
// Webhook 處理（用于接收支付狀態(tài)更新）
app.post('/webhook', express.raw({type: 'application/json'}), (req, res) => {
  const sig = req.headers['stripe-signature'];
  const webhookSecret = '你的_WEBHOOK_SECRET';
  let event;
  try {
    event = stripe.webhooks.constructEvent(req.body, sig, webhookSecret);
  } catch (err) {
    return res.status(400).send(`Webhook Error: ${err.message}`);
  }
  // 處理事件
  switch (event.type) {
    case 'payment_intent.succeeded':
      const paymentIntent = event.data.object;
      console.log('PaymentIntent 成功:', paymentIntent.id);
      // 這里處理支付成功后的業(yè)務(wù)邏輯
      break;
    case 'payment_intent.payment_failed':
      console.log('支付失敗');
      break;
    default:
      console.log(`未處理的事件類型: ${event.type}`);
  }
  res.json({received: true});
});
app.listen(3000, () => {
  console.log('服務(wù)器運(yùn)行在 http://localhost:3000');
});

3. 前端實(shí)現(xiàn)（使用 Stripe.js）

<!-- public/index.html -->
<!DOCTYPE html>
<html>
<head>
  <script src="https://js.stripe.com/v3/"></script>
</head>
<body>
  <button id="checkout-button">支付 $20</button>
  <script>
    const stripe = Stripe('你的_STRIPE_PUBLISHABLE_KEY');
    document.getElementById('checkout-button').addEventListener('click', async () => {
      // 方法 1: 使用 Checkout Session
      const response = await fetch('/create-checkout-session', {
        method: 'POST',
      });
      const session = await response.json();
      // 重定向到 Stripe Checkout
      const result = await stripe.redirectToCheckout({
        sessionId: session.id
      });
      if (result.error) {
        alert(result.error.message);
      }
    });
  </script>
</body>
</html>

4. 使用 Payment Intents 的更靈活方式

// 前端代碼
const elements = stripe.elements();
const cardElement = elements.create('card');
cardElement.mount('#card-element');
const form = document.getElementById('payment-form');
form.addEventListener('submit', async (event) => {
  event.preventDefault();
  // 從后端獲取 client secret
  const response = await fetch('/create-payment-intent', {
    method: 'POST',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({amount: 2000})
  });
  const {clientSecret} = await response.json();
  // 確認(rèn)支付
  const {error, paymentIntent} = await stripe.confirmCardPayment(clientSecret, {
    payment_method: {
      card: cardElement,
      billing_details: {
        name: '客戶姓名'
      }
    }
  });
  if (error) {
    console.log('支付失敗:', error);
  } else if (paymentIntent.status === 'succeeded') {
    console.log('支付成功!');
  }
});

關(guān)鍵要點(diǎn)：

環(huán)境變量：將 Stripe 密鑰存儲(chǔ)在環(huán)境變量中
金額單位：Stripe 使用最小貨幣單位（美元用美分）
Webhook：用于接收異步支付通知
測(cè)試模式：使用測(cè)試密鑰和測(cè)試卡號(hào)（如 4242 4242 4242 4242）進(jìn)行開發(fā)

上面只是一個(gè)基礎(chǔ)實(shí)現(xiàn)，實(shí)際生產(chǎn)環(huán)境中還需要考慮錯(cuò)誤處理、安全性、訂單管理等更多細(xì)節(jié)。

到此這篇關(guān)于Node.js 實(shí)現(xiàn) Stripe 支付的實(shí)現(xiàn)方法的文章就介紹到這了,更多相關(guān)node.js stripe 支付內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: