Stripe 'card-element' не отображается. Почему?

Полностью теряю рассудок от этого...

Я создаю сайт электронной коммерции на django. В качестве провайдера платежного шлюза я использую Stripe. Я не понимаю ... Stripe 'card-element' не отображается. Почему ?

Для информации, в предыдущие дни элемент карты отображался корректно. Я мог имитировать платежи, которые регистрировались в моем аккаунте Stripe... Дело в том, что я проверил старые версии своего кода, которые раньше работали (на случай, если я допустил ошибку). Но ни одна из них не работает... Это сводит меня с ума

Что-то не так с моим кодом? Есть идеи ?

checkout.html

{% extends 'main.html' %}
{% load static %}

{% block content %}

<script src="https://js.stripe.com/v3/"></script>

<div class="container">
    <div class="row">
        <div class="col d-flex justify-content-center align-items-center">
            <h3 class="text-primary fw-bold">PAIEMENT PAR CARTE</h3>
        </div>
    </div>

    <div class="row ">  
        <div class="col d-flex justify-content-center align-items-center">
            <form id="payment-form" method='POST' class="col">
                {% csrf_token %}
                <div class="form-control" id="card-element"></div>
                <div class="sr-field-error" id="card-errors" role="alert"></div>
                <button id="payer-submit" class="btn btn-primary">
                    <div class="spinner-border spinner-border-sm text-light d-none" id="spinner" role="status"></div>
                    <span class="text-white" id="button-text">Pay</span>
                    <span class="text-white" id="order-amount"></span>
                </button>
            </form>
        </div>
    </div>

    <div class="row ">
        <div class="col d-flex justify-content-center align-items-center">
            <form id="payload" method='POST' class="col" action="/payment/payment-bycard-complete">
                {% csrf_token %}
                <input id ="data-payload" type="hidden" name="payload"/>
            </form>
        </div>
    </div>
</div>


<script type="text/javascript" src="{% static '/js/stripe.js' %}"></script>

{% endblock content %}

stripe.js

views.py

Версии :
Django 3.1.6
stripe 2.60.0

EDIT

Консоль

Promise { <state>: "pending" }
​
<state>: "fulfilled"
​
<value>: Object { publishableKey: "pk_test_51Ia5dlE8XikcpErQEGGuA56itbGvPLmnZSNALSKvVGK2syFR21CvPoYMCJtOjb2DArvAKT1hd1z2KSS4wZmpDqre00ZppDWLLl", clientSecret: "pi_3JPkJfE8XikcpErQ0NuBgyfq_secret_C94xiK71RDMFaZImXYc12c1rn" }


Uncaught (in promise) TypeError: Response.json: Body has already been consumed.
    <anonymous> http://127.0.0.1:8000/static/js/stripe.js:16
    promise callback* http://127.0.0.1:8000/static/js/stripe.js:13
stripe.js:16:21

Согласно отладчику :

В

.then(function(result) {
            return result.json();
        })

return result.json() bugs

У меня был console.log(result.json()) перед return result.json(), что не допускается при fetch. Я убрал этот console.log(result.json()) и теперь все работает.

Вернуться на верх