来自前端的条带连接呼叫，以编程方式更改条带连接 ID

问题描述

我正在尝试解决这个我似乎无法用 Stripe 的 API 解决的问题

I'm trying to solve this proble that I cant seem to solve with stripe's API's

因此，当使用他们的新版本 API 创建费用时，他们说在前端我们应该调用 loadStripe('Pusblishable Key',{'Connected account ID'}) 并将其设置为常量.

So when creating a charge with their new version API they say that in the front end we should call loadStripe('Pusblishable Key',{'Connected account ID'}) and set that to a const.

现在我不明白我们应该如何获取存储在某个地方(比如数据库)的 ID?

now I dont undestand how are we supposed to get the ID that is stored somewhere say a database?

作为参考请看this 和 此处(在第 3 步中...).

As a reference please look at this and here (In Step 3 ...).

我目前正在做的事情是这样的

What I'm currently doing is something like this

        import React from 'react';
        import ReactDOM from 'react-dom';
        import {Elements} from '@stripe/react-stripe-js';
        import {loadStripe} from '@stripe/stripe-js';

        import CheckoutForm from './CheckoutForm';

      //btw I have set this to const and to let and none work
        const stripePromise =
          fetch("url", {


              method: "POST",
              headers: {
                'Content-Type': 'application/json',
              },
              body: JSON.stringify({
                anything:window.sessionStorage.getItem("Variable Account")
    //here store something that  will tell what account to pull ID data from
              })
            }).then(data => data.json()).then((result)=>{
              return(loadStripe('KEY',{stripeAccount:result}))

            })

class App extends React.Component{
render(){
return(
     <Elements stripe={stripePromise}>
      <CheckoutForm />
    </Elements>
)}
}

export default(App)

但是const 似乎没有正确加载，如果一个人按照应用程序的常规流程说从myapp.com/home -> 单击 myapp.com/home/something-> 然后 myapp.com/home/something/payment 条带未加载但刷新浏览器现在可以工作，但这告诉我我做的可能是错误的或也许我必须在componentDidMount()"中刷新应用程序?

but the const seems to not load correctly, if one goes with the regular flow of the app say frommyapp.com/home -> click myapp.com/home/something-> then myapp.com/home/something/payment stripe is not loading but one refreshes the browser now works but that tells me i'm doing maybe something wrong or I have to make the app refresh in 'componentDidMount()' maybe?

可以将其设置为静态，但连接的帐户可以很多，因此如果有人可以帮助我，我将不胜感激

One can set it to be static but connected accounts can be many so if anyone can help me with this I would appreciate it

推荐答案

回答与您重复的问题相同:如何正确加载具有异步值的全局变量(Reactjs)?

Answered the same as your duplicate question: How to properly load global variable with async values(Reactjs)?

通常，您希望在您的应用中使用此帐户 ID.但是如果您需要检索它，那很好，但要确保 stripePromise 是您认为的那样.例如，我可以在这里通过模拟 fetch 调用来完成这项工作:https://codesandbox.io/s/stripe-connect-w-resolve-wts34

Generally, you'd want to have this account ID available in your app. But if you need to retrieve it, that's fine, but make sure the stripePromise is what you think it is. For example, I can make this work here with a simulated fetch call here: https://codesandbox.io/s/stripe-connect-w-resolve-wts34

请注意，我正在明确管理 Promise:

Note that I'm managing the Promise explicitly:

const stripePromise = new Promise((resolve, reject) => {
  fetch(...)
  .then(data => data.json())
  .then(result => {
    resolve(
      loadStripe(STRIPE_PUBKEY, { stripeAccount: "acct_xxx" })
    );
  });
});

您描述这种导航中断的事实表明您的路线可能不正确.如果这是单页应用，导航不应导致 App 组件重新呈现.

The fact that you describe this breaking with navigation suggests you might be routing incorrectly. If this is a single page app, the navigation shouldn't cause the App component to re-render.

这篇关于来自前端的条带连接呼叫，以编程方式更改条带连接 ID的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！