полосовая подписка с реакцией - PullRequest
Новая
       1

полосовая подписка с реакцией

0 голосов
/ 30 октября 2019

Вот мой сценарий, пользователь может зарегистрироваться, предоставив основную информацию, такую ​​как имя пользователя, пароль и выбрав план подписки (план подписки создается на полосе). теперь согласно плану, выбранному пользователем, я хочу собрать информацию о платеже от пользователя и разместить эти данные на моем внутреннем сервере, чтобы создать пользователя с указанным планом подписки. Сначала я попробовал это решение Client Only Integration 

import React from 'react'
const stripe = window.Stripe('pk_test_my_test_key');

export default class Checkout extends React.Component {
checkout=()=> {
    stripe.redirectToCheckout({

      items: [
        {plan: 'plan_my_plan_Id', quantity: 1}
      ],
      successUrl: 'http://localhost:3000/register',
      cancelUrl: 'http://localhost:3000/register'
    }).then((result) => {
      console.log(result)
    });
  }

render() {
     return (
       <button onClick={this.checkout}>Pay</button>
     )
   }
}

Приведенное выше решение работает таким образом, что оно подписывает пользователя на план на полосе и перенаправляет мое приложение на указанный successUrl. но как мне создать этого пользователя на моем бэкэнде? При возвращении successUrl я потерял всю другую информацию, заполненную пользователем. Более того, в документации полосок также сказано, что я не должен полагаться на successUrl при совершении покупок , и вместо этого я должен полагаться на веб-хуки.
Так что, если я настрою свой бэкэнд для прослушивания событий веб-хука, как быв событии webhook я найду информацию о пользователе для создания пользователя на бэкенде.

Я пробовал другое решение, используя response-stripe-checkout , которое описано в этой ссылке https://alligator.io/react/payments-stripe-checkout-react/

Вот код, который я использовал сверху ссылка 

import React from 'react'
import StripeCheckout from 'react-stripe-checkout';

export default class Checkout extends React.Component {
onToken = (token, addresses) => {

};

render() {
return (
  <StripeCheckout
    stripeKey="your_PUBLISHABLE_stripe_key"
    token={this.onToken}
  />
)
   }

}

Я думаю, что следуя этому процессу, я смогу обработать событие onToken и передать дополнительную информациюмой бэкэнд, а затем создайте плату и пользователя на моем бэкенде и отправьте ответ на мой фронтенд. но, к сожалению, я не могу найти какую-либо информацию о том, как передать свой план в StripeCheckout.

Как я могу выполнить эту задачу, каково лучшее решение для этого сценария?

любезно помогите

...