So I'm implementing a custom checkout page but I want it to redirect if the person's card doesn't go through. Currently when a card doesn't go through there's a message sent to the dev console that says "Charge ID: undefined"
I'd like it to redirect the purchaser to a lightbox or a separate page notifying them that there was an error. I'm not a super adept programmer and not really familiar with Corvid. Here's what I have on my page, there's a public .js file also some backend stuff.
import wixLocation from 'wix-location';
import {createToken, encodeCard} from "public/stripeAPI.js";
import {charge} from 'backend/stripeProxy';
var payment;
export function payNow(event) {
createToken(encodeCard(createCard()))
.then((token) => {
console.log("Card token: " + token);
charge(token, payment)
.then((chargeResponse) => {
console.log("Charge ID: " + chargeResponse.id);
});
});
}
function createCard(){
return{
"name":$w("#cname").value,
"number":$w("#cnumber").value,
"cvc":$w("#cvc").value,
"exp_year":$w("#year").value,
"exp_month":$w("#month").value,
}
}
function changeState(){
payment = {
"amount":($w("#amt").value * 100),
"currency":"USD",
"description":$w("#desc").value
}
}
export function chargeCard_click(event, $w) {
payNow();
}
export function amt_viewportEnter(event) {
changeState();
}
export function desc_change(event) {
changeState();
}
if (console === "Charge ID: undefined") { wixLocation.to("<card-fail-URL>") } else { wixLocation.to("<card-success-URL>"); }
Here's what comes up in the dev console when the card fails:
I feel like I shouldn't be calling the console for the if/else statement, also the else statement is issuing the SDK error.
Thanks in advance,
Liam
Your if/else statement is located in a place where it won't run, and checking the value of console is wrong.
Did you use the Stripe payment example?
Stripe Payment Processing
Integrate the Stripe Payment processing system into a site. Three levels of user access are demonstrated: visitor, freemium (registered), and premium (paid).
If you're using the example mentioned above, you can redirect on error in the payNow() function:
export function payNow() { let payment = { "amount": ($w("#amount").value * 100), "currency": "USD", "description": $w("#description").value } createToken(encodeCard(createCard())) .then((token) => { charge(token, payment, wixUsers.currentUser.id) .then((response) => { if(response.chargeId) { $w('#response').text = response.chargeId; $w('#lblResponse').text = "Charge ID (response from Stripe):"; $w('#btnClearPaid').label = "CLEAR PAID"; $w('#btnClearPaid').show(); wixLocation.to("<card-success-URL>"); // redirect on success } else { $w('#response').text = response.error; $w('#lblResponse').text = "Processing error (from Stripe):"; wixLocation.to("<card-fail-URL>"); // redirect on error } $w('#response').show(); }); }); }