Next with Stripe

page.jsx

function LoadScript(src) {
  return new Promise((resolve, reject) => {
    const script = document.createElement('script')

    script.src = src
    script.addEventListener('load', resolve)
    script.addEventListener('error', reject)

    document.body.appendChild(script)
  })
}


export default class ComponentWithStripe extends React.Component {
  stripe = this.loadStripeHandler(this)
  
  loadStripeHandler(Component) {
    if (!process.browser) return
    
    LoadScript('https://checkout.stripe.com/checkout.js')
      .then(() => {
        Component.stripe = window.StripeCheckout.configure({
          key: 'xxxxxxx',
          image:
            'https://stripe.com/img/documentation/checkout/marketplace.png',
          locale: 'auto',
          token: this.payWithStripe
        })
      })
      .catch(error => {
        console.log(error)
      })
  }

  payWithStripe(token) {
    // payment stuff
  }

  render () {
    // jsx
  }
}