Enable client-side encryption

Encrypt your customer’s sensitive payment information using client-side encryption.

Encrypt your customer’s payment information on their device before you process it on your server.


Access the CSE library and public key

After client-side encryption is enabled for your account, log in to your Genesis account to access the CSE library and your public key.

  1. Log in to Genesis using with your Merchant account.
  2. In the navigation menu, go to Configuration > Merchants.
  3. Select the name of your merchant account.
  4. Expand the Client-side Encryption Key dropdown.
  5. Locate and copy the Script Tag and Public Key fields.

Use the CSE library in your payment form

When you create your payment form, add the Script Tag you retrieved from your Genesis account inside the <head> element of your payment page.

Example of a CSE library script added to the html header of a payment page:
  <script src=”https://{unique-address}/encrypto-{VERSION}.js”

Flag all eligible fields for encryption using the data-encrypted-name attribute. The fields that can be encrypted are:

  • card_holder
  • card_number
  • expiration_month
  • expiration_year
  • cvv
Example of a payment form with eligible attributes flagged for encryption:
  <form method=”POST” action=”/request-payment” id=”encrypto-form”>
      <input type=”text” data-encrypted-name=”card_number”/>
      <input type=”text” data-encrypted-name=”card_holder”/>
      <input type=”text” data-encrypted-name=”cvv”/>
      <input type=”text” name=”country”/>
      <input type=”text” name=”city”/>
    <input type=”submit” value=”Pay”/>

Add the Public Key you retrieved from your Genesis account inside a <script> element on your payment page.

Example of adding your public client-side encryption key to your payment form:
    var publicKey = ‘LS0tLS1CRUdJTiBQVUJMSUMgS0VZLS0tLS0KTUlJQklqQU5CZ2txaGtpRzl…’;

    Encrypto.createEncryptedForm(publicKey, {
      // formId: ‘encrypto-form’,               // Optional: Set a custom form identifier
      // onSubmit: function(form) {             // Optional: Perform a custom callback on form submit
      //   console.log(form.fields);              
      // }

With client-side encryption enabled, continue to make transaction requests to the emerchantpay gateway like in a standard server-to-server integration. The gateway will decrypt your customer’s payment information using the public encryption key provided in your payment form.