Integrating Moneris Checkout with JavaScript: Handling JSON Response Issues

Moneris Checkout Integration with JavaScript: Front-End and Back-End Solutions

Front-end solution utilizing JavaScript to incorporate the Moneris Checkout form and handle transaction responses.

// Front-end integration script
// This script embeds the Moneris checkout and processes the transaction result

<script src="https://gatewayt.moneris.com/chktv2/js/chkt_v2.00.js"></script>
<div id="monerisCheckout"></div>
<script>
var myCheckout = new monerisCheckout();
myCheckout.setMode("qa"); // Set environment to QA
myCheckout.setCheckoutDiv("monerisCheckout"); // Define div for checkout
// Add callback for when the page is fully loaded
myCheckout.setCallback("page_loaded", myPageLoad);
// Start the checkout process
myCheckout.startCheckout("");

// Function that gets triggered when the page is loaded
function myPageLoad(ex) {
    console.log("Checkout page loaded", ex);
}

// Function to handle the receipt after the payment
function myPaymentReceipt(ex) {
    if(ex.response_code === '00') {
        alert("Transaction Successful: " + ex.ticket);
    } else {
        alert("Transaction Failed: " + ex.message);
    }
}
</script>

Back-End Solution with Node.js and Express: Handling Payment Data

Back-end solution utilizing Node.js and Express to manage Moneris' post-payment data

// Node.js backend script for processing payment receipt data
// This backend handles the response from Moneris and processes it for database storage

const express = require('express');
const bodyParser = require('body-parser');

const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

// Endpoint to receive the payment result
app.post('/payment-receipt', (req, res) => {
    const paymentData = req.body;

    if (paymentData.response_code === '00') {
        console.log('Payment successful:', paymentData.ticket);
        // Insert into database or further process the payment
        res.status(200).send('Payment success');
    } else {
        console.error('Payment failed:', paymentData.message);
        res.status(400).send('Payment failed');
    }
});

app.listen(3000, () => {
    console.log('Server running on port 3000');
});

Unit Testing the Backend Payment Handling with Mocha and Chai

Backend unit testing with Mocha and Chai to validate money handling functionality

// Unit test for the Node.js backend using Mocha and Chai
// This test checks if the backend properly handles successful and failed transactions

const chai = require('chai');
const chaiHttp = require('chai-http');
const app = require('../app'); 
const expect = chai.expect;
chai.use(chaiHttp);

describe('POST /payment-receipt', () => {
    it('should return 200 for successful payment', (done) => {
        chai.request(app)
            .post('/payment-receipt')
            .send({ response_code: '00', ticket: '123456' })
            .end((err, res) => {
                expect(res).to.have.status(200);
                expect(res.text).to.equal('Payment success');
                done();
            });
    });

    it('should return 400 for failed payment', (done) => {
        chai.request(app)
            .post('/payment-receipt')
            .send({ response_code: '01', message: 'Transaction Declined' })
            .end((err, res) => {
                expect(res).to.have.status(400);
                expect(res.text).to.equal('Payment failed');
                done();
            });
    });
});

Common Questions About Moneris Checkout Integration

1. What is Moneris Checkout?
2. Moneris Checkout is a payment gateway solution that enables businesses to securely accept payments through their website. It provides customisable checkout forms and accepts a variety of payment ways.
3. How can I customize the Moneris Checkout form?
4. The Moneris API allows you to customize the design of the checkout form by changing elements such as buttons and input fields. Use commands like setCustomStyle() to add your brand's style to the form.
5. What is the importance of setting the environment to "qa"?
6. Setting the environment to "qa" with setMode("qa") allows you to safely test transactions without processing real payments.
7. How do I handle a pre-authorization transaction?
8. To manage pre-authorization, include the action: "preauth" argument in your JSON request. This will place a hold on the customer's card rather than charging it immediately.
9. What are the security measures provided by Moneris Checkout?
10. Moneris supports tokenization, which replaces sensitive credit card information with a token. Compliance with PCI DSS assures that your integration meets industry security requirements.

Final Thoughts on Moneris Checkout Integration

To successfully integrate Moneris Checkout with JavaScript, both the front-end and back-end setups must be carefully planned. Providing a good checkout experience for users requires ensuring that transaction details, such as the ticket number, are appropriately captured.

Testing in a QA environment and properly structuring your payment form will help you detect problems early. With the correct technique, you can create a seamless and secure payment procedure that suits your company's goals while assuring client happiness.