This folder contains the previous version of the sample application that uses Adyen Web 5.68.x.
Check the root folder of the repository to use the latest Adyen Web 6.x
The demo leverages Adyen's API Library for Node.js (GitHub | Docs).
Node.js 18+ Adyen Web 5.68.x
- Clone this repo:
git clone https://github.com/adyen-examples/adyen-vue-online-payments.git
- Navigate to the
v5
directory and install dependencies:
cd v5
npm install
- Create a
./.env
file with the required info
Remember to include http://localhost:8080
in the list of Allowed Origins
PORT="8080"
ADYEN_API_KEY="your_API_key_here"
ADYEN_MERCHANT_ACCOUNT="your_merchant_account_here"
ADYEN_CLIENT_KEY="your_client_key_here"
ADYEN_HMAC_KEY="your_hmac_key_here"
- Start the server:
npm run dev
- Visit http://localhost:8080 to select an integration type.
To try out integrations with test card numbers and payment method details, see Test card numbers.
Webhooks deliver asynchronous notifications about the payment status and other events that are important to receive and process. You can find more information about webhooks in this blog post.
In the Customer Area under the Developers → Webhooks
section, create a new Standard webhook
.
A good practice is to set up basic authentication, copy the generated HMAC Key and set it as an environment variable. The application will use this to verify the HMAC signatures.
Make sure the webhook is enabled, so it can receive notifications.
This demo provides a simple webhook implementation exposed at /api/webhooks/notifications
that shows you how to receive, validate and consume the webhook payload.
The following webhooks events
should be enabled:
- AUTHORISATION
To make sure that the Adyen platform can reach your application, we have written a Webhooks Testing Guide that explores several options on how you can easily achieve this (e.g. running on localhost or cloud).