Integracja Moneris Checkout z JavaScript: Obsługa problemów z odpowiedziami JSON

Bezproblemowa integracja Moneris Checkout: rozwiązywanie problemów z odpowiedzią JSON

Moneris Checkout to powszechnie używany system bramek płatniczych, który pomaga firmom przyspieszyć transakcje online. Jednak zintegrowanie go z witryną może być trudne, zwłaszcza gdy wymagane dane, takie jak numer biletu, nie są zwracane w wyniku wywołania JSON. Takie błędy mogą utrudniać regularny przepływ transakcji, dlatego debugowanie jest niezbędną umiejętnością inżynierów.

Zrozumienie, jak prawidłowo skonfigurować realizację transakcji, ma kluczowe znaczenie w przypadku wymiany przestarzałej hostowanej strony płatności (HPP) na Moneris i korzystania z jej interfejsu JavaScript. Aby zapewnić swoim klientom bezproblemową obsługę, upewnij się, że strona publikuje szczegóły transakcji i pobiera dokładne odpowiedzi.

Wielu programistów ma problemy z zapoznaniem się z dokumentacją integracyjną Moneris. Złożoność wynika z obsługi wywołań zwrotnych, przesyłania danych transakcyjnych i odczytywania wyników w czasie rzeczywistym, a wszystko to jest wymagane do pomyślnej integracji. Na początku swojej podróży integracyjnej posiadanie jasnej i dobrze udokumentowanej metodologii może być korzystne.

W tym poście przyjrzymy się, jak rozwiązać problem brakujących numerów biletów w integracji z Moneris. Będziesz lepiej przygotowany do poradzenia sobie z tym problemem, jeśli przejrzysz niezbędne fragmenty kodu i techniki rozwiązywania problemów.

Zrozumienie integracji Moneris Checkout i przepływu pracy skryptowej

Dołączony skrypt front-end integruje system Moneris Checkout ze stroną internetową za pomocą JavaScript. Podstawowa funkcjonalność rozpoczyna się od ustanowienia instancji kasy Moneris poprzez monerisCheckout() konstruktor. Ta instancja służy jako interfejs pomiędzy Twoją witryną a usługą przetwarzania płatności Moneris. Polecenie tryb ustawiania() określa, czy środowisko powinno być ustawione na „qa” na potrzeby testowania, czy „na żywo” na potrzeby produkcyjne, co jest krytyczne na etapach programowania. Wybierając „qa”, programiści mogą replikować transakcje bez ponoszenia rzeczywistych kosztów, tworząc bezpieczny poligon doświadczalny.

Po zbudowaniu instancji kasy, setCheckoutDiv() polecenie łączy formularz realizacji transakcji Moneris z określonym elementem div HTML. W tym miejscu na stronie pojawi się formularz płatności. Gwarantuje to, że wizualne przedstawienie formularza płatności pojawi się w określonym obszarze witryny, dzięki czemu procedura będzie płynna i zintegrowana z istniejącym projektem. W naszym przykładzie formularz Moneris jest wstawiany do elementu div z identyfikatorem „monerisCheckout”. Ten element div służy jako element zastępczy dynamicznie ładowanej zawartości Moneris, która obejmuje pola i przyciski służące do wprowadzania płatności klienta.

Następnie skrypt jest wykonywany ustawCallback(), umożliwiając programiście skonfigurowanie określonej obsługi zdarzeń dla procesu realizacji transakcji. W szczególności do funkcji dołączone jest wywołanie zwrotne dla „page_loaded”. myPageLoad, gwarantując, że po pełnym załadowaniu strony mogą wystąpić dodatkowe niestandardowe działania (takie jak rejestrowanie danych). Ta funkcja pozwala na elastyczność w sposobie obsługi doświadczenia użytkownika. Rejestrowanie zawartości pliku były obiekt wewnątrz myPageLoad() pomaga programistom w debugowaniu, dostarczając w czasie rzeczywistym informacji zwrotnych na temat danych zwracanych przez Moneris.

Na koniec skrypt zaplecza obsługuje odbiór danych płatności po stronie serwera. Używanie Express.js w Node.js trasa aplikacja.post() jest zdefiniowany tak, aby otrzymywać żądania POST od Moneris po zakończeniu transakcji. Ten punkt końcowy przetwarza zwrócony JSON, sprawdzając kod_odpowiedzi aby sprawdzić, czy płatność się powiodła. Jeśli transakcja się powiedzie, dane transakcji (takie jak numer biletu) można zarejestrować lub wprowadzić do bazy danych. Zwracając odpowiednie kody statusu i komunikaty, backend umożliwia płynne połączenie z frontendem, dostarczając użytkownikowi krytyczną informację zwrotną, np. czy transakcja się powiodła, czy nie.

// 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>

// 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 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();
            });
    });
});

Ulepszanie integracji Moneris Checkout z opcjami dostosowywania

Pracując z integracją Moneris Checkout, programiści często szukają metod personalizacji procesu realizacji transakcji w celu poprawy komfortu użytkowania. Formularz płatności Komponenty interfejsu użytkownika można dostosować, co jest mniej znaną funkcją. Moneris umożliwia firmom dostosowanie wyglądu i układu strony kasy, co pozwala im dopasować ją do swojej marki. Wiąże się to z modyfikowaniem układów przycisków, pól formularzy, a nawet sformułowań, aby ułatwić proces użytkownikom końcowym i zwiększyć konwersję.

Kolejnym czynnikiem, który należy zbadać, jest wykorzystanie rodzajów transakcji innych niż płatności podstawowe. Moneris posiada możliwości takie jak preautoryzacja, w ramach której kwota transakcji jest przechowywana na karcie, ale nie jest natychmiast pobierana. Ta funkcjonalność jest szczególnie istotna w obszarach takich jak hotele i wypożyczalnie samochodów, gdzie ostateczne stawki mogą się różnić. Integracja może obsłużyć wiele typów transakcji przy użyciu tego samego API, co czyni go uniwersalnym do różnych zastosowań.

Bezpieczeństwo jest najwyższym priorytetem w każdej integracji płatności, a Moneris Checkout wykorzystuje technologie takie jak tokenizacja i zapobieganie oszustwom. Tokenizacja zastępuje wrażliwe informacje o karcie tokenem, dzięki czemu dane konsumentów nigdy nie zostaną ujawnione w Twoich systemach. Wdrożenie środków bezpieczeństwa, takich jak technologie wykrywania oszustw i zgodność ze standardem PCI DSS, może radykalnie zmniejszyć ryzyko związane z transakcjami online.