0
votes

I am getting a 502 (Bad Gateway) error with Stripe. The payment successfully charges the card and shows up in the Stripe dashboard but it does not show its succesful on the front end and instead I get 502 error.

Am I suppose to add something below to make the front end show the payment is successful? Using the docs here: https://stripe.com/docs/stripe-js/elements/payment-request-button

  // Send the token to your server to charge it!
        fetch('/apple-pay', {
        method: 'POST',
        body: JSON.stringify({token: ev.token.id}),
        headers: {'content-type': 'application/json'},
      })

      .then(function(response) {
        console.log(response)
        if (response.ok) {
          // Report to the browser that the payment was successful, prompting
          // it to close the browser payment interface.
          ev.complete('success');
        } else {
          // Report to the browser that the payment failed, prompting it to
          // re-show the payment interface, or show an error message and close
          // the payment interface.
          ev.complete('fail');
        }
      });
    });

Server Side Code

app.post('/apple-pay', function(req, res, next) {
// Set your secret key: remember to change this to your live secret key in production
 var stripe = require("stripe")("sk_test_xxx");
console.log('we got here....')
// Token is created using Checkout or Elements!
// Get the payment token ID submitted by the form:

const token = req.body.token;
console.log(req.body)

// Using Express

console.log('this is the Token...' + token)
const charge = stripe.charges.create({
  amount: 499,
  currency: 'usd',
  description: 'Example charge',
  source: token,
}, function(err, charge) {
  // asynchronously called
  console.log(err)
});
});
1
The issue likely comes from the code server-side and you haven't shared it. You need to add logs to your code to track what value(s) you are returning exactlykoopajah
@koopajah addedAndrewLeonardi
Sure but you had another question earlier where you said the charge did not work. Did you add logs to the code that you read and were able to debug? For example right now you code creates a charge asynchronously and never returns anything, no response, no 200, etc. You need to handle the request properlykoopajah
@koopajah Yes! I managed to solve that. Now the Payment successfully completes. And I can see it in the Stripe dashboard. However on the front end it looks like it does not complete...AndrewLeonardi
Awesome! I explained above what to look for though. You need to ensure that your code waits for the charge creation to be done and only then return a value. You likely want to read up on Node.js, Async flows, how to handle requests on your server, etc.koopajah

1 Answers

1
votes

As discussed in the comments, the issue is that the request server-side does not return any status code and because of this the client-side code does not know it succeeded!