-
adyen-node-online-payments
Accept payments on your Node.js/Express-based website with cards, wallets, and key local payment methods
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
# Clone this repo $ git clone https://github.com/deepu105/payment-request-api-example $ cd payment-request-api-example # Install dependencies $ npm install # create a file named `.env` with values `API_KEY="your_Adyen_API_key"` and `MERCHANT_ACCOUNT="your_Adyen_merchant_account"` $ vi .env # start application $ npm start
You can find the complete source code for this example here. I'm not going to focus on the backend as I'm using a simplified version of the NodeJS backend from this example, you can read this tutorial if you are interested in the backend.
async function checkout() { try { const adyenPaymentMethods = await callServer("/api/getPaymentMethods"); // create a new payment request const request = new PaymentRequest(buildSupportedPaymentMethodData(adyenPaymentMethods), buildShoppingCartDetails()); // show payment sheet const payment = await request.show(); // Here we would process the payment. const response = await callServer("/api/initiatePayment", { // This works only for PCI compliant credit card payments. // For non PCI compliant payments the data needs to be encrypted with something like https://github.com/Adyen/adyen-cse-web // But encrypting data here is not secure as a malicious script may be able to access the data in memory here paymentMethod: { type: "scheme", number: payment.details.cardNumber, expiryMonth: payment.details.expiryMonth, expiryYear: payment.details.expiryYear, holderName: payment.details.cardholderName, cvc: payment.details.cardSecurityCode, }, }); // Handle the response code switch (response.resultCode) { case "Authorised": await payment.complete("success"); window.location.href = "/result/success"; break; case "Pending": case "Received": await payment.complete("unknown"); window.location.href = "/result/pending"; break; case "Refused": await payment.complete("fail"); window.location.href = "/result/failed"; break; default: await payment.complete("fail"); window.location.href = "/result/error"; break; } } catch (error) { // ... } return false; }
Note: This is absolutely not recommended for production use with Adyen as the Payment Request API is quite new and capturing credit card data via this is still not as secure as using the Web components provided by Adyen which securely encrypts the data. I'm not encrypting card details, which is only possible if you are PCI compliant and your Adyen account has the necessary roles. In the future, once the Payment Handler API becomes widely implemented by browsers, this could change and Adyen might start providing official support for this. We will see more about that later in the post.