我正在将Stripe集成到我的Blazor应用程序中，我需要的功能是替换现有的"添加卡"组件。
我使用JS库中的stripe.confirmSetup方法成功地实现了这一点，但是这需要一个重定向URL，这会导致一些问题，因为我们的应用程序的其余部分并不像这样工作。
我已经确定createPaymentMethod作为一个替代品，因为它不需要重定向URL，以模态打开任何3DS页面，并支持"then"回调方法，在那里我可以显示一个成功的弹出窗口并相应地更新DOM。
问题是当我传递我以前安装的卡元素时，我会得到这个错误。
创建付款方法的值无效：卡为payment元素，不能用于创建卡PaymentMethods

• • 剃刀/html**

<EditForm id="payment-form" Model="@BillingProfile">
        <div id="payment-element">
            <!-- Elements will create form elements here -->
        </div>

        @if (stripeReady)
        {
            <div class="text-center mt-2">
                <button type="button" @onclick="TogglePaymentEditStripe" class="btn btn-grey text-dark">Cancel</button>  
                <button type="submit" id="submitStripeCard" disabled="@(Busy)" class="btn btn-blue">Add card</button>
            </div>                }

        <!-- We'll put the error messages in this element -->
        <div id="payment-method-errors" role="alert"></div>   
    </EditForm>

• • 脚本语言**

export function initialiseStripeAndMount(publishableKey, clientIntentSecret, redirectUrl){

    const stripe = Stripe(publishableKey);  

    const options = {
        clientSecret: clientIntentSecret, //intent
        // Fully customizable with appearance API.
        appearance: {
            theme: 'night',
            labels: 'floating',           
        }
    };

    // Set up Stripe.js and Elements to use in checkout form, passing the client secret obtained in step 3
    const elements = stripe.elements(options);

    // Create and mount the Payment Element
    const cardElement = elements.create('payment');
    cardElement.mount('#payment-element');

    // Create a token or display an error when the form is submitted.
    const form = document.getElementById('payment-form');

    form.addEventListener('submit', async (event) => {
        event.preventDefault();

        const result = await stripe.createPaymentMethod({                
            type: 'card',
            card: cardElement,
            billing_details: {

                name: 'Jenny Rosen',
            },
            })
            .then(function (result) {
                // Handle result.error or result.paymentMethod
                alert(result)
            });
    });
   
}

• • 问题**

如何将'createPaymentMethod'函数与条带装入元素一起使用，以避免页面按照他们的文档回发：

编辑
如果我尝试将confirmSetup与以下命令一起使用：

stripe.confirmSetup({
    elements,
    confirmParams: {
        // Return URL where the customer should be redirected after the SetupIntent is confirmed.
        return_url: 'http://www.google.co.uk',
        redirect: "if_required"
    },
})

然后，我得到一个错误代码400响应，其中包含以下响应对象：

{
  "error": {
    "code": "parameter_unknown",
    "doc_url": "https://stripe.com/docs/error-codes/parameter-unknown",
    "message": "Received unknown parameter: redirect",
    "param": "redirect",
    "request_log_url": "[Redacted]",
    "setup_intent": {
      "id": "[Redacted]",
      "object": "setup_intent",
      "cancellation_reason": null,
      "client_secret": "[Redacted]",
      "created": [Redacted],
      "description": null,
      "last_setup_error": null,
      "livemode": false,
      "next_action": null,
      "payment_method": null,
      "payment_method_types": [
        "card"
      ],
      "status": "requires_payment_method",
      "usage": "off_session"
    },
    "type": "invalid_request_error"
  }
}