Проект ASP.NET 8 MVC – встроенная оплата Stripe не работает ⇐ C#

[Anonymous]

Я следую онлайн-документации Stripe, чтобы создать встроенную форму оплаты для подключенных учетных записей.
https://docs.stripe.com/connect/direct- ... orm=web&ui =embedded-form&client=html#mount-checkout
Мой ключ тестового API правильно установлен в Program.cs
Эта конечная точка в моем контроллере в основном прямо из руководства по API Stripe, и он с радостью возвращает секрет клиента:

Код: Выделить всё

[HttpGet]
[AllowAnonymous]
public ContentResult StripeCheckoutSession()
{
var options = new Stripe.Checkout.SessionCreateOptions
{
LineItems = new List
{
new Stripe.Checkout.SessionLineItemOptions
{
PriceData = new Stripe.Checkout.SessionLineItemPriceDataOptions
{
Currency = "aud",
ProductData = new Stripe.Checkout.SessionLineItemPriceDataProductDataOptions
{
Name = "T-shirt",
},
UnitAmount = 1000,
},
Quantity = 1,
},
},
PaymentIntentData = new Stripe.Checkout.SessionPaymentIntentDataOptions
{
ApplicationFeeAmount = 123,
},
Mode = "payment",
UiMode = "embedded",
ReturnUrl = "abc={CHECKOUT_SESSION_ID}"
};
var requestOptions = new RequestOptions
{
StripeAccount = "acct_12345...";
};
var service = new SessionService();
Session session = service.Create(options, requestOptions);
return Content(JsonConvert.SerializeObject(session.ClientSecret));
}

В заголовке моего представления .cshtml я добавил этот элемент сценария:

Код: Выделить всё

В теле у меня есть такая разметка:

Код: Выделить всё

Также в голове у меня есть этот javascript, скопированный из руководства по API Stripe.

Код: Выделить всё

// initialize Stripe.js
const stripe = Stripe('pk_test_blah...', {
stripeAccount: {{CONNECTED_ACCOUNT_ID}},
});

initialize();

// fetch checkout session and retrieve client secret
async function initialize() {
const fetchClientSecret = async () => {
const response = await fetch("/StripeCheckoutSession", {
method: "POST",
});
const { clientSecret } = await response.json();
return clientSecret;
};

// initialize checkout
const checkout = await stripe.initEmbeddedCheckout({
fetchClientSecret,
});

// mount checkout
checkout.mount('#checkout');
}

Обратите внимание: я заменил {{CONNECTED_ACCOUNT_ID}} ссылкой на фактическое значение из модели представления следующим образом:

Код: Выделить всё

'@Model.StripeAccountID'

Когда я запускаю проект, ничего не происходит — пустой белый экран. Я наполовину ожидал этого, потому что не понимаю, как вызывается метод Initialize(). И я вижу, что он никогда не выполняется.
Итак, я написал js так, как, по моему мнению, он должен работать следующим образом:

Код: Выделить всё

    
// initialize Stripe.js
const stripe = Stripe('pk_test_blah...', {
stripeAccount: '@Model.StripeAccountID',
});

$(document).ready(function () {
initialize();
})

// fetch checkout session and retrieve the client secret
async function initialize() {
try {
alert('Start');
const fetchClientSecret = async () => {
const response = await fetch("StripeCheckoutSession", {
method: "GET",
});
const { clientSecret } = await response.json();
return clientSecret;
};
// initialize checkout
alert('Init checkout');
const checkout = await stripe.initEmbeddedCheckout({
fetchClientSecret,
});
// mount checkout
alert('Finish mount');
checkout.mount('#checkout');
}
catch (err) {
alert(err);
}
}

Я вижу предупреждение('Начать'), а затем предупреждение('Завершить монтирование'), но не вижу предупреждение('Начать проверку')
Я также попробовал использовать отдельную функцию с помощью вызова AJAX, чтобы получить секрет клиента. Сама функция работала, но инициализировать проверку не удалось.
Что я делаю не так? Может ли кто-нибудь помочь мне с этим?

Подробнее здесь: https://stackoverflow.com/questions/791 ... ot-working