Stripe 付款后重定向到不同的页面 - Node.js答案

【问题标题】：Redirect to a different page after Stripe payment - Node.jsStripe 付款后重定向到不同的页面 - Node.js
【发布时间】：2018-11-29 12:21:53
【问题描述】：

我正在按照https://stripe.com/docs/recipes/custom-checkout 的指南在我的网站上放置一个自定义结帐按钮。到目前为止，测试付款将通过，我可以创建一个客户和一个新的费用。

我坚持的部分实际上是在交易后将用户重定向到/success 页面，例如收费的详细信息。我尝试过使用res.render('success') 甚至res.redirect('/success')，但它没有执行。

<button id="upgrade_membership"</button>

<script>
  var checkoutHandler = StripeCheckout.configure({
    key: "<%= keyPublishable %>",
    locale: "auto"
  });

  var button = document.getElementById("upgrade_membership");
    button.addEventListener("click", function(ev) {
    checkoutHandler.open({
      name: "Name",
      description: "Description",
      image: 'images/path.jpg',
      token: handleToken
    });
  });

  function handleToken(token) {
    fetch("/charge", {
      method: "POST",
      headers: {"Content-Type": "application/json"},
      body: JSON.stringify(token)
    })
    .then(response => {
      if (!response.ok)
        throw response;
        return response.json();
      })
   .then(output => {
     console.log("Purchase succeeded:", output);
   })
   .catch(err => {
     console.log("Purchase failed:", err);
   })
}
</script>

服务器

app.post("/charge", async (req, res) => {
  let amount = 1000;

  // Check user has stripe id as stripe do not check for uniqueness of email address
  try {
    var user_stripe_id = await queries.get_stripe_id_by_email(req.body.email);
  } catch (err) {
    console.log("Error with Query " + err);
    return;
  }

  if(user_stripe_id !== null) {
    // Need to process payment as a current customer on stripe
    return;
  } else {
    // Create Stripe Customer
    stripe.customers.create({
      email: req.body.email,
      card: req.body.id
    })
  .then(customer =>
    // Charge Customer payment
    stripe.charges.create({
      amount,
      description: "description here",
      currency: "GBP",
      customer: customer.id
    }))
    .then(charge => {
      // gets all the way here and logs out the charge object
      // want to redirect here
      res.send(charge)
      // if i replace the above with res.render('home') nothing happens 
    })
    .catch(err => {
      console.log("Error:", err);
      res.status(500).send({error: "Purchase Failed"});
    });
   } // if/else
});

因此，在浏览器控制台中成功交易后，我会打印出Purchase succeeded:。

我想要实现的是将服务器端重定向到另一个页面

更新

所以我想在付款成功后在这里渲染一个不同的页面，但我什么都做不了

res.render('home') // does not work
return res.render('home') // does not work
return res.redirect('/') // does not work
res.redirect('/') // does not work

而且更令人困惑

console.log("I WANT TO RENDER A NEW PAGE")
res.render('home')
console.log("WHY IS THIS BEING LOGGED")

正在记录两个控制台日志

是因为我在then 链中吗？真的不明白这里发生了什么

【问题讨论】：

在这种情况下我所做的就是在每一步之后添加console.log。试一试，你会发现你的代码到底哪里出了问题

标签： node.js express stripe-payments stripe.js

【解决方案1】：

问题在于获取 API 和 POST 请求的工作方式。请参阅 this SO discussion 了解为什么您不能将 res.render() 与 fetch API 一起使用，并参阅 this SO discussion 了解如何在来自客户端的 fetch 请求后重定向。

将这些放在一起，您可以在 fetch 响应中发回您想要重定向到的 url，然后使用 window.location.replace(...) 从客户端重定向到该 url

【讨论】：