//EcheckoutServices.ts
import soap from 'soap';
import type { CollectPaymentRequest } from './CollectPaymentRequest';
import type { CollectPaymentResponse } from './CollectPaymentResponse';
import type { GetPaymentRequest } from './GetPaymentRequest';
import type { GetPaymentResponse } from './GetPaymentResponse';
const WSDL_QA_URL = process.env.WSDL_QA_URL || './wsdl/qa.wsdl';
const WSDL_PROD_URL = process.env.WSDL_PROD_URL || './wsdl/prod.wsdl';
export const createClient = async (
mode: string,
keys: { username: string; password: string },
) => {
const wsdl = mode === 'qa' ? WSDL_QA_URL : WSDL_PROD_URL;
const options = {
wsdl_options: {
login: keys.username,
password: keys.password,
},
authentication: 'SOAP_AUTHENTICATION_BASIC',
soap_version: 1.1,
trace: true,
cache_wsdl: 'WSDL_CACHE_NONE',
};
return new Promise<soap.Client>((resolve, reject) => {
soap.createClient(wsdl, options, (err: any, client: soap.Client) => {
if (err) {
reject(err);
} else {
resolve(client);
}
});
});
};
export const collectPayment = async (
request: CollectPaymentRequest,
client: soap.Client,
): Promise<CollectPaymentResponse> => {
return new Promise<CollectPaymentResponse>((resolve, reject) => {
client.collectPayment(
{ arg0: request },
(err: any, result: CollectPaymentResponse) => {
if (err) {
reject(err);
} else {
resolve(result);
}
},
);
});
};
export const getPayment = async (
request: GetPaymentRequest,
client: soap.Client,
): Promise<GetPaymentResponse> => {
return new Promise<GetPaymentResponse>((resolve, reject) => {
client.getPayment(
{ arg0: request },
(err: any, result: GetPaymentResponse) => {
if (err) {
reject(err);
} else {
resolve(result);
}
},
);
});
};
//collectPayment.ts
import type { NextApiRequest, NextApiResponse } from 'next';
import { createClient, collectPayment } from './EcheckoutServices';
import { CollectPaymentRequest } from './CollectPaymentRequest';
import { CollectPaymentResponse } from './CollectPaymentResponse';
export default async (req: NextApiRequest, res: NextApiResponse) => {
console.log('API Route Hit');
if (req.method === 'POST') {
console.log('Request Body:', req.body);
const {
keys,
mode,
paymentRequest,
}: {
keys: { username: string; password: string };
mode: string;
paymentRequest: CollectPaymentRequest;
} = req.body;
try {
const client = await createClient(mode, keys);
const response: CollectPaymentResponse = await collectPayment(
paymentRequest,
client,
);
res.status(200).json(response);
} catch (error) {
console.error('Error:', error);
if (error instanceof Error) {
res.status(500).json({ error1: error.message });
} else {
res.status(500).json({ error2: 'An unknown error occurred' });
}
}
} else {
res.status(405).json({ error: 'Method not allowed' });
}
};
//frontend.ts
const handleNext = async () => {
const keys = {
clientid: 'clientid',
};
const orderId = '123456789';
const paymentItems = [
new PaymentItem(
100,
'CAPS1',
'Description1',
'ID1',
'ID2',
'ID3',
'Item1',
1,
'Type1',
),
];
const collectPaymentRequest = new CollectPaymentRequest();
collectPaymentRequest
.setReturnURL('/vehicle-stickers')
.setCancelURL('/vehicle-stickers')
.setClientId(keys.clientid)
.setOrderId(orderId)
.setCustomerFirstName('firstName')
.setCustomerLastName('lastName')
.setCustomerEmail('[email protected]')
.setPaymentAmount(300)
.setPaymentItems(paymentItems);
try {
const keys = {
username: ‘username’,
password: ‘password’,
};
const mode = 'qa'; // or 'prod' based on your requirement
const requestBody = { keys, mode, collectPaymentRequest };
console.log('Sending request to /api/collectPayment');
const response = await fetch(`/api/collectPayment`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(requestBody),
});
if (!response.ok) {
console.log('Response status:', response.status);
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
console.log('Response data:', data);
setResponse(data);
} catch (error) {
if (error instanceof Error) {
console.error('Payment API call failed:', error);
openModal('message', {
title: 'Payment Error',
content: `An error occurred while processing the paymentssss: ${error.message}`,
variant: 'error',
});
} else {
console.error('Unexpected error:', error);
openModal('message', {
title: 'Unexpected Error',
content:
'An unexpected error occurred. Please try again later.',
variant: 'error',
});
}
}
},
});
}
};
getting “Payment API call failed: Error: HTTP error! status: 500” error messages.
I’m trying to implement a payment system in my Next.js project that involves calling a SOAP API. I’m using the soap library to create the SOAP client and handle the requests. However, I’m encountering a 500 Internal Server Error when making the API call from the frontend. Here is a summary of my setup: