Apr 12, 2020
0
Level 1
resource_missing
Hi,
How to solve below error?
I follow this instruction, https://stripe.com/docs/stripe-js/elements/fpx-bank#content
{
"error": {
"code": "resource_missing",
"doc_url": "https://stripe.com/docs/error-codes/resource-missing",
"message": "No such payment_intent: seti_1GX9LZKjtpl3OAQeE7vU37n3",
"param": "intent",
"type": "invalid_request_error"
}
}
My Vue code,
<template>
<div id="user-premium">
<form id="payment-form">
<div class="form-row">
<div>
<label for="fpx-bank-element">
FPX Bank
</label>
<div id="fpx-bank-element">
<!-- A Stripe Element will be inserted here. -->
</div>
</div>
</div>
<div class="block-wrapper">
<button class="button-base" id="add-card-button" v-on:click="submitPaymentMethod()">
Save Payment Method
</button>
</div>
<!-- Used to display form errors. -->
<div id="error-message" role="alert"></div>
</form>
</div>
</template>
<script>
import {mapGetters} from 'vuex'
import {debounce} from 'lodash'
import {events} from '@/bus'
import axios from 'axios'
export default {
data(){
return {
stripeAPIToken: 'pk_test_IaxnERnxMUcXP7COS66EwXcw00V5tklVBQ',
stripe: '',
elements: '',
card: '',
intentToken: '',
name: '',
addPaymentStatus: 0,
addPaymentStatusError: '',
paymentMethods: [],
paymentMethodsLoadStatus: 0,
paymentMethodSelected: {},
selectedPlan: '',
}
},
mounted(){
this.includeStripe('js.stripe.com/v3/', function(){
this.configureStripe();
}.bind(this) );
this.loadIntent();
},
methods: {
includeStripe( URL, callback ){
const documentTag = document, tag = 'script',
object = documentTag.createElement(tag),
scriptTag = documentTag.getElementsByTagName(tag)[0];
object.src = '//' + URL;
if (callback) { object.addEventListener('load', function (e) { callback(null, e); }, false); }
scriptTag.parentNode.insertBefore(object, scriptTag);
},
configureStripe(){
this.style = {
base: {
// Add your base input styles here. For example:
padding: '10px 12px',
color: '#32325d',
fontSize: '16px',
}
};
this.stripe = Stripe( this.stripeAPIToken );
this.elements = this.stripe.elements();
this.fpxBank = this.elements.create(
'fpxBank',
{style: this.style, accountHolderType: 'individual'});
this.fpxBank.mount('#fpx-bank-element');
},
loadIntent(){
axios.get('/api/user/setup-intent')
.then( function( response ){
this.intentToken = response.data;
}.bind(this));
},
/*
Uses the intent to submit a payment method
to Stripe. Upon success, we save the payment
method to our system to be used.
*/
submitPaymentMethod(){
this.addPaymentStatus = 1;
this.stripe.confirmFpxPayment(
this.intentToken.client_secret, {
payment_method: {
fpx: this.fpxBank
},
}
).then(function(result) {
if (result.error) {
this.addPaymentStatus = 3;
this.addPaymentStatusError = result.error.message;
} else {
}
}.bind(this));
}
}
}
</script>
Thanks
Please or to participate in this conversation.