Develop an E-Commerce App Using Java, Spring Boot and Vue.js/

...

/

Stripe Checkout Front-end Integration

Stripe Checkout Front-end Integration

Learn how to integrate stripe checkout at the front-end in this lesson.

We'll cover the following...

In the last lesson, we passed two URLs for success and failure. First, we’ll create those two pages.

We’ll create a payment directory in the views directory, and then create two components.

Press + to interact
<template>
  <div class="alert alert-success" role="alert">
    Payment successful
  </div>
</template>
<script>
export default {
    name:'PaymentSuccess',
    props:["baseURL"],
    data() {
    return {
      token: null,
      sessionId:null
    }
  },
  methods:{
  },
  mounted(){
  }
}
</script>

Similarly, we’ll create a failed component.

Press + to interact
<template>
    <div class="alert alert-danger" role="alert">
        Payment failed
    </div>
</template>
<script>
export default {
    name:'FailedPayment',
    mounted(){
    }
}
</script>

Router

...