PWA Studio (Venia)

Technical manual for MultiSafepay's plugin.

Prerequisites

Payment methods

By default, this plugin supports all payment methods supported by our Magento 2 plugin out of the box, except:

  • Request To Pay
  • Direct Debit
  • E-Invoicing
  • Pay After Delivery

You can integrate these payment methods yourself.
See MultiSafepay GitHub – PWA Studio components .

Installation

  1. Install the MultiSafepay plugin for supporting GraphQL queries, which includes the MultiSafepay Core, Frontend and Adminhtml plugins. For instructions, see MultiSafepay GitHub – Magento 2 GraphQL.
  2. Configure the payment methods and your API keys in the Magento admin panel.
  3. To configure the URLs for your success and cancellation pages, go to Stores > Configuration > MultiSafepay > General settings > Advanced settings > Use custom return URLs for PWA storefront integration.
    • For Custom redirect URL after canceling the payment, we recommend using: <your_pwa_url>/cart?maskedId={{quote.masked_id}}&multisafepayRestore=true
    • For the Custom success page URL, we recommend using: <your_pwa_url>/multisafepay/checkout/success/{{order.increment_id}}/maskedId/{{quote.masked_id}}
  4. Install Venia storefront. For instructions, see Magento GitHub – Venia PWA concept.
    • Go to the extension folder:
    cd your_project/packages/extensions
    
    • Create a MultiSafepay extension folder:
    mkdir multisafepay-payment-integration
    
    • Clone all extension files from this repository into the multisafepay-payment-integration folder.
    • Link the extension in venia-concept package.json.
    • Go to the venia-concept folder and open package.json:
    cd your_project/packages/venia-concept
    
    • Add the next dependency:
    "dependencies": {
         "@multisafepay/multisafepay-payment-integration": "link:../extensions/multisafepay-payment-integration"
     },
    
    • Go back to the project root folder and execute the following commands:
    yarn install && yarn watch:venia
    
  5. Explore the checkout in your Venia application:
    Screenshot 2021-03-25 at 12 56 46Screenshot 2021-03-25 at 12 56 46


💬

Support

Contact MultiSafepay:

Top of page