如何在Flutter Stripe中从支付卡创建可复用的Token

flutter_stripe不再提供前端直接生成信用卡Token的API（Stripe官方推荐使用其预构建的卡片组件来规避PCI合规风险），但如果需要通过手动收集的卡片信息创建Token，需通过后端调用Stripe服务器API实现，具体步骤如下：

1. 前端收集并校验卡片信息 #

通过表单收集卡号、CVC、有效期，先做基础格式校验：

// 示例表单控制器
final cardNumberCtrl = TextEditingController();
final cvcCtrl = TextEditingController();
final expMonthCtrl = TextEditingController();
final expYearCtrl = TextEditingController();

// 整理卡片数据
final cardData = {
  'number': cardNumberCtrl.text.replaceAll(' ', ''),
  'cvc': cvcCtrl.text,
  'exp_month': int.parse(expMonthCtrl.text),
  'exp_year': int.parse(expYearCtrl.text),
};

2. 后端调用Stripe Token接口 #

使用Stripe服务器端SDK（以Node.js为例）调用POST /v1/tokens接口生成Token：

const stripe = require('stripe')('你的Stripe秘钥');

app.post('/api/create-card-token', async (req, res) => {
  const { number, cvc, exp_month, exp_year } = req.body;
  try {
    const token = await stripe.tokens.create({
      card: { number, cvc, exp_month, exp_year }
    });
    res.json({ tokenId: token.id });
  } catch (err) {
    res.status(400).json({ error: err.message });
  }
});

3. 前端请求后端获取Token #

通过http/dio包调用自己的后端接口，拿到Token后用于后续支付：

import 'package:http/http.dart' as http;
import 'dart:convert';

Future<String> fetchCardToken(Map<String, dynamic> cardData) async {
  final response = await http.post(
    Uri.parse('你的后端域名/api/create-card-token'),
    headers: {'Content-Type': 'application/json'},
    body: json.encode(cardData),
  );
  if (response.statusCode == 200) {
    return json.decode(response.body)['tokenId'];
  } else {
    throw Exception('Token生成失败');
  }
}

更合规的替代方案 #

直接处理卡片信息会涉及PCI合规问题，Stripe推荐使用flutter_stripe提供的CardField组件收集卡片信息，直接生成PaymentMethod（无需手动创建Token）：

final paymentMethod = await Stripe.instance.createPaymentMethod(
  PaymentMethodParams.card(
    card: CardDetails(
      number: cardNumberCtrl.text,
      cvc: cvcCtrl.text,
      expMonth: int.parse(expMonthCtrl.text),
      expYear: int.parse(expYearCtrl.text),
    ),
  ),
);
// 使用paymentMethod.id即可发起支付

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