Stripe API问题：如何仅在PaymentElement中显示Apple Pay

核心原因 #

Stripe的SetupIntent不支持直接将apple_pay作为独立的payment_method_type参数传入——Apple Pay本质是基于card类型的支付手段，并非独立支付方式，所以直接传会触发「支付方式类型无效」的报错。

实现方案 #

有两种可靠的实现方式，都能达到仅显示Apple Pay的效果：

方案1：启用自动支付方式+前端限制显示

后端创建SetupIntent时启用自动支付方式，前端初始化PaymentElement时指定只显示Apple Pay：

• 后端代码（Node.js示例）：

const setupIntent = await stripe.setupIntents.create({
  automatic_payment_methods: {
    enabled: true,
  },
});

• 前端代码（以React为例）：

const options = {
  clientSecret: 后端返回的client_secret,
  paymentMethodTypes: ['apple_pay'],
};

const elements = stripe.elements(options);
const paymentElement = elements.create('payment');
paymentElement.mount('#payment-element');

方案2：手动指定card类型+前端限制显示

后端指定payment_method_types为['card']（因为Apple Pay属于card类），前端同样通过配置限制只显示Apple Pay：

• 后端代码（Node.js示例）：

const setupIntent = await stripe.setupIntents.create({
  payment_method_types: ['card'],
});

• 前端代码和方案1完全一致，依然通过paymentMethodTypes: ['apple_pay']来过滤显示。

注意事项 #

• 确保前端运行环境满足Apple Pay的要求：必须是Safari浏览器（桌面/移动）、Apple设备，且网站使用HTTPS协议，否则Apple Pay选项不会显示。

内容的提问来源于stack exchange，提问作者Gardelin