Hi everyone, thank you for reading this.
I have been trying to setup a payment gateway for our e-commerce platform, and this is a little issue i have ran into. All the code I have written are based on this doc: https://www.authorize.net/content/dam/anet-redesign/documents/VisaCheckoutJavaScriptIntegrationGuide.pdf
This is what we have done so far:
1. We generated and used our APIkey on authorize.net
2. We are using a demo HTML to test all the codes
3. Here is the code we wrote specifically for payment:
<html>
<head>
<script type="text/javascript">
function onVisaCheckoutReady() {
V.init({
apikey: "****************************",
sourceId: "Merchant Defined Source ID",
settings: {
locale: "en_US",
countryCode: "US",
displayName: "...Corp",
logoUrl: "www.Some_Image_URL.gif",
// customerSupportUrl: "www....Corp.support.com",
// shipping: {
// acceptedRegions: ["US", "CA"],
// collectShipping: "true"
// },
payment: {
cardBrands: [
"VISA",
"MASTERCARD"],
acceptCanadianVisaDebit: "true"
},
review: {
message: "Merchant defined message",
buttonAction: "Pay"
},
dataLevel: "SUMMARY"
},
paymentRequest: {
merchantRequestId: "Merchant defined request ID",
currencyCode: "USD",
subtotal: "1.10",
// shippingHandling: "2.00",
// tax: "2.00",
// discount: "1.00",
// giftWrap: "2.00",
// misc: "1.00",
total: "1.10",
description: "Megacorp Product",
orderId: "1111",
promoCode: "Merchant defined promo code",
customData: {
"nvPair": [
{ "name": "customName1", "value": "customValue1" },
{ "name": "customName2", "value": "customValue2" }
]
}
}
});
V.on("payment.success", function(payment) {
console.log('----------------payment.success------------');
console.log('payment.success: ' + JSON.stringify(payment));
alert('payment.success: ' + JSON.stringify(payment));
});
V.on("payment.cancel", function(payment) {
console.log('----------------payment.cancel------------');
console.log('payment.cancel: ' + JSON.stringify(payment));
alert('payment.cancel: ' + JSON.stringify(payment));
});
V.on("payment.error", function(payment, error) {
console.log('----------------payment.error------------');
console.log('payment.error: ' + JSON.stringify(error));
alert('payment.error: ' + JSON.stringify(error));
});
}
</script>
</head>
<body>
<!-- <img alt="Visa Checkout" class="v-button" role="button"
src="https://sandbox.secure.checkout.visa.com/wallet-services-web/xo/button.png?cardBrands=VISA,MASTERCARD,DISCOVER,AMEX" /> -->
<img alt="Visa Checkout" class="v-button" role="button" src="https://assets.secure.checkout.visa.com/wallet-services-web/xo/button.png?
cardBrands=VISA,MASTERCARD,DISCOVER,AMEX" />
<script type="text/javascript" src="https://assets.secure.checkout.visa.com/checkout-widget/resources/js/integration/v1/sdk.js">
// <script type="text/javascript"
// src="https://sandbox-assets.secure.checkout.visa.com/checkout-widget/resources/js/integration/v1/sdk.js">
</script>
</body>
</html>
4. We have tested with a USA based Visa card, and the callback resulted in "Sucessful"
<?xml version="1.0" encoding="utf-8"?><decryptPaymentDataResponse xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="AnetApi/xml/v1/schema/AnetApiSchema.xsd"><messages><resultCode>Ok</resultCode><message><code>I00001</code><text>Successful.</text></message></messages><shippingInfo><firstName>Qiaer</firstName><lastName>***</lastName><address>******</address><city>***</city><state>***</state><zip>***</zip><country>US</country></shippingInfo><billingInfo><firstName>*****</firstName><lastName>****</lastName><address>*****</address><city>Irvine</city><state>****</state><zip>***</zip><country>US</country><email>*****************</email></billingInfo><cardInfo><expirationDate>*********</expirationDate><cardArt><cardBrand>VISA</cardBrand><cardImageHeight>210</cardImageHeight><cardImageUrl>https://assets.vims.visa.com/vims/cardart/8a2d278b53594ca095d52095e5913295_imageA@2x.png</cardImageUrl><cardImageWidth>334</cardImageWidth><cardType>DEBIT</cardType></cardArt></cardInfo><paymentDetails><currency>USD</currency><promoCode>Merchant defined promo code</promoCode><subTotal>1.10</subTotal><orderID>1111</orderID><amount>1.10</amount></paymentDetails></decryptPaymentDataResponse>
Now our issue is this:
After receiving an "successful" callback from either authorize or Visa (we are not sure either), no payment was made on the test card, and no money was deducted on the said card.
We are a bit lost as of why this is happening. We are eager to see your replies! Thank you.
