创建Stripe令牌时出现问题：402（需要付款）错误

Question

Good day everyone,

Below is the error code that is thrown in console:

   (index):3 POST https://api.stripe.com/v1/tokens 402 (Payment Required)

(index):3 POST https://api.stripe.com/v1/tokens 402 (Payment Required)c @ (index):3e @ (index):3a @ (index):3Stripe.isDoubleLoaded.Stripe.xhr @ (index):3Stripe.a._rawRequest @ (index):2Stripe.a.request @ (index):2Stripe.token.a.create @ (index):2Stripe.card.b.createToken @ (index):2Stripe.a._channelListener @ (index):2incoming @ (index):2f @ (index):2

Below is the javascript code

// Generate the user token
$(function() {


      // Once the user has submited the form
      $(".submit").click(function(e) {

                  // Prevent the form from submiting by default
          e.preventDefault();

          // Ensure that checkbox is checked
          if($('#checkbox').is(":checked")) {

            // Prevent the form from submiting by default
            var $form = $('#payment-form');

            // Request a token from Stripe:
            Stripe.card.createToken($form, stripeResponseHandler);

            // Prevent the form from being submitted:
            return false;
          }
          else {

        // Display an error message to the user by writting directly into the header error tag
        document.getElementById('checkboxError').innerHTML = "You must kindly accept the terms and conditions to continue.";
          }
       });

      // Ensure that checkbox is checked
      if($('#checkbox').is(":checked")) {

        var appendedStripeToken = false;

        function stripeResponseHandler(status, response) {
          // Grab the form:
          var $form = $('#payment-form');

          if (response.error) { // Problem!

            // Scroll to the billing section
            $("#billingError").scrollTop();

            // Show the errors on the form:
            $form.find('.payment-errors').text(response.error.message);
            $form.find('.submit').prop('disabled', false); // Re-enable submission

          } else { // Token was created!

            // Get the token ID:
            var token = response.id;
            handleCall(token);

          }

          // What to do after the token has been generated.
          function handleCall(token) { 
           var $form = $('#payment-form');
            if (!appendedStripeToken) { 
                // Insert the token into the form so it gets submitted to the server
                appendedStripeToken = true; 
                phpCall(); 
            } 
          }

          // Post the package name, the token, and the user name information to the billing.php page
          function phpCall() {
           if( appendedStripeToken === true ){
             $.ajax({
              type: "POST",
              data: {run: true, packageName: $('#packageName').val(), token: token, userName: $('#userName').val(),customerName: $('#customerName').val() },
              url: '/app/functions/billing.php',
              success: function (response) {//response is value returned from php (for    your example it's "bye bye"
                            $('#payment-form').prop('disabled', true); // TODO: give your html-submit-input-tag an "id" attribute
              window.location = response;
                }
               });
             }
            } 
          }

      } 


});

Below is the HTML code

              <!-- Package name to be submitted to server -->
              <input type="hidden" id="packageName" value="{{ packageName|capitalize }}">

              <!-- Username to be submitted to server -->
              <input type="hidden" id="userName" value="{{ userName }}">
               <input type="hidden" id="customerName" value="{{ customerName }}">



              <div class="form-row">
                <label for="cardHolder">Cardholder Name</label><br>
                  <input type="text" id="cardHolder" size="20" data-stripe="name">
                </label>
              </div>
              <br><br>


              <div class="form-row">
                <label for="cardNumber">Card Number </label><br>
                  <input type="text" id="cardNumber" size="20" data-stripe="number">
                </label>
              </div>
              <br>
              <img src="/public/images/credit-card/visa.png" class="card-visa">
              <img src="/public/images/credit-card/mastercard.png" class="card-mastercard">
                <img src="/public/images/credit-card/american-express.png" class="card-aexpress">




              <br>

              <div class="form-row">
                <label for="cardExpiration"> Expiration (MM/YY)</label><br>
                  <input class="expirationNumber" type="text" size="2" id="cardExpiration" data-stripe="exp_month">
                </label>
                <span> / </span>
                <input class="expirationNumber" type="text" size="2" data-stripe="exp_year">
              </div>
              <br><br>

              <div class="form-row">
                <label for="cardCVC">CVC</label><br>
                  <input type="text" id="cardCVC" size="4" data-stripe="cvc">
                </label>
              </div>

              </div>
            </div>

             <input type="checkbox" id="checkbox"> 
             <label for="checkbox">By purchasing this package you are agreeing to our Terms & Conditions</label><br><br>
              <h4 id="checkboxError"></h4>
               <button type="submit" class="submit btn-tangerine">Submit Payment</button>

              </form>

Any help would be greatly appreciated!

I thnk that the main error lies in the following line:

Stripe.card.createToken($form, stripeResponseHandler);

What is suppose to happen is really simple. Token gets created when all proper information are given, and then the token along with other information are posted via ajax to the server where a PHP code will create the charge using these information.

Answer 1

I was facing same issue when I add test API KEYS for payment, then site was working fine and when I add live key then site shows same error on console. But problem was, I was testing live key with test credit card number. May be you were doing same mistake

And sorry for bad English.