Question

我正在使用django和stripe学习过时的django电子商务课程。该课程大约有4年的历史，因此django和stripe发生了很多变化，这使我对这两者进行了大量研究。我在本教程的结尾处，在创建结帐页面时遇到了一个问题，更重要的是使用条形图来“创建费用”。我收到以下错误消息：

django.utils.datastructures.MultiValueDictKeyError django.utils.datastructures.MultiValueDictKeyError：'stripeToken'

我在Creating Charge文档中读到了

token = request.POST ['stripeToken']＃使用Flask

用于Flask（我认为），但是当我删除['stripeToken']时，会收到此错误消息：

stripe.error.InvalidRequestError stripe.error.InvalidRequestError：要求req_kikB88HKbEkq9W：找不到付款信息

我需要一种在提交表单时通过条带化付款信息的方法。另外，我遇到了这个post，但发布商收到了对多种表单的错误消息

view.py

from django.conf import settings
from django.contrib.auth.decorators import login_required
from django.shortcuts import render
import stripe

stripe.api_key = settings.STRIPE_SECRET_KEY
# Create your views here.

@login_required
def checkout(request):
    publish_key = settings.STRIPE_PUBLISHABLE_KEY
    if request.method == 'POST':
        token = request.POST['stripeToken']
        stripe.Charge.create(
            amount=999,
            currency='usd',
            description='Example charge',
            source=token,
            statement_descriptor='Custom descriptor',
        )
    context = {'publish_key': publish_key}
    template = 'checkout.html'
    return render(request, template, context)

checkout.html

 {% extends 'base.html' %}

{% block content %}

<div class="col-sm-6 offset-md-3">
          <h4 class="mb-3">Billing address</h4>
          <form id="payment-form" action="" method="post">{% csrf_token %}
            <div class="row">
              <div class="col-md-6 mb-3">
                <label for="firstName">First name</label>
                <input type="text" class="form-control" id="firstName" required style="background-image: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABHklEQVQ4EaVTO26DQBD1ohQWaS2lg9JybZ+AK7hNwx2oIoVf4UPQ0Lj1FdKktevIpel8AKNUkDcWMxpgSaIEaTVv3sx7uztiTdu2s/98DywOw3Dued4Who/M2aIx5lZV1aEsy0+qiwHELyi+Ytl0PQ69SxAxkWIA4RMRTdNsKE59juMcuZd6xIAFeZ6fGCdJ8kY4y7KAuTRNGd7jyEBXsdOPE3a0QGPsniOnnYMO67LgSQN9T41F2QGrQRRFCwyzoIF2qyBuKKbcOgPXdVeY9rMWgNsjf9ccYesJhk3f5dYT1HX9gR0LLQR30TnjkUEcx2uIuS4RnI+aj6sJR0AM8AaumPaM/rRehyWhXqbFAA9kh3/8/NvHxAYGAsZ/il8IalkCLBfNVAAAAABJRU5ErkJggg==&quot;); background-repeat: no-repeat; background-attachment: scroll; background-size: 16px 18px; background-position: 98% 50%;" required/>
                <div class="invalid-feedback">
                  Valid first name is required.
                </div>
              </div>
              <div class="col-md-6 mb-3">
                <label for="lastName">Last name</label>
                <input type="text" class="form-control" id="lastName" required />
                <div class="invalid-feedback">
                  Valid last name is required.
                </div>
              </div>
            </div>

            <div class="mb-3">
              <label for="email">Email <span class="text-muted"></span></label>
              <input type="email" class="form-control" id="email" placeholder="you@example.com" required />
              <div class="invalid-feedback">
                Please enter a valid email address for shipping updates.
              </div>
            </div>

            <div class="mb-3">
              <label for="address">Address</label>
              <input type="text" class="form-control" id="address" placeholder="1234 Main St" required />
              <div class="invalid-feedback">
                Please enter your shipping address.
              </div>
            </div>

            <div class="mb-3">
              <label for="address2">Address 2 <span class="text-muted"></span></label>
              <input type="text" class="form-control" id="address2" placeholder="Apartment or suite" />
            </div>

            <div class="row">
              <div class="col-md-5 mb-3">
                <label for="city">City</label>
               <input type="text" class="form-control" id="city" required />
                <div class="invalid-feedback">
                  Zip code required.
                </div>
              </div>

              <div class="col-md-4 mb-3">
                <label for="state">State</label>
                <select class="custom-select d-block w-100" id="state" required>
                  <option value="">Choose...</option>
                  <option>California</option>
                </select>
                <div class="invalid-feedback">
                  Please provide a valid state.
                </div>
              </div>
              <div class="col-md-3 mb-3">
                <label for="zip">Zip</label>
                <input type="text" class="form-control" id="zip" required />
                <div class="invalid-feedback">
                  Zip code required.
                </div>
              </div>
            </div>
            <hr class="mb-4">
            <div class="custom-control custom-checkbox">
              <input type="checkbox" class="custom-control-input" id="same-address">
              <label class="custom-control-label" for="same-address">Shipping address is the same as my billing address</label>
            </div>
            <div class="custom-control custom-checkbox">
              <input type="checkbox" class="custom-control-input" id="save-info">
              <label class="custom-control-label" for="save-info">Save this information for next time</label>
            </div>
            <hr class="mb-4">

            <h4 class="mb-3">Payment</h4>

                <div class="d-block my-3">
                <label for="card-element">Credit or debit card</label>
                    <div id="card-element" class="form-control" style='height: 2.4em; padding-top: .7em;'>
                    <!-- A Stripe Element will be inserted here. -->
                     </div>
                     <!-- Used to display form errors. -->
                    <div id="card-errors" role="alert"></div>
                </div>
            <hr class="mb-4">
            <button class="btn btn-outline-success btn-lg btn-block" type="submit">Continue to checkout</button>
          </form>
        </div>

{% endblock %}

app.js

// Create a Stripe client.
const stripe = Stripe('{{ publish_key }}');

// Create an instance of Elements.
const elements = stripe.elements();

// Create an instance of the card Element.
const card = elements.create('card', {});

// Add an instance of the card Element into the `card-element` <div>.
card.mount('#card-element');

// Handle real-time validation errors from the card Element.
card.addEventListener('change', ({error}) => {
  const displayError = document.getElementById('card-errors');
  if (error) {
    displayError.textContent = error.message;
  } else {
    displayError.textContent = '';
  }
});

// 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 {token, error} = await stripe.createToken(card);

  if (error) {
    // Inform the customer that there was an error.
    const errorElement = document.getElementById('card-errors');
    errorElement.textContent = error.message;
  } else {
    // Send the token to your server.
    stripeTokenHandler(token);
  }
});

// Submit the form with the token ID.
const stripeTokenHandler = (token) => {
  // Insert the token ID into the form so it gets submitted to the server
  const form = document.getElementById('payment-form'),
        hiddenInput = document.createElement('input');
  hiddenInput.setAttribute('type', 'hidden');
  hiddenInput.setAttribute('name', 'stripeToken');
  hiddenInput.setAttribute('value', token.id);
  form.appendChild(hiddenInput);

  // Submit the form
  form.submit();
}

尝试提交付款表格时出现“ stripeToken”错误

0 个答案: