Шифрование на стороне клиента

Шифрование на стороне клиента - это шифрование конфиденциальной информации (например, номер банковской карточки) на стороне устройства пользователя (в браузере или мобильном приложении) до отправки данных в систему интернет-магазина или интернет-сервиса.

Используя этот сервис, вы не принимаете, не обрабатываете и не храните конфиденциальную информацию на ваших серверах. Это делает оплату для клиента более безопасной и уменьшает к вам количество требований стандарта PCI DSS.

Описание схемы шифрования на стороне клиента

Шифрование на стороне клиента может быть легко реализовано на странице оплаты вебсайта и в мобильном приложении с помощью готовых библиотек PayCross для каждой из платформ:

веб (смотрите далее),
iOS,
Android.

После установки библиотеки схема шифрования выглядит следующим образом:

Библиотека использует публичный RSA ключ торговца, чтобы зашифровать данные о банковской карте покупателя.
Торговец получает зашифрованную информацию и передает ее в систему PayCross для завершения и авторизации оплаты.
PayCross расшифровывает полученную информацию с помощью приватного RSA ключа, завершает операцию и отправляет торговцу ответ с результатом операции.

Установка библиотеки PayCross

Выполните следующие шаги, чтобы реализовать шифрование в вашей веб-форме:

1. Добавьте begateway-cse.js и ваш публичный ключ

Добавьте PayCross JavaScript библиотеку на вашу страницу, используя следующий код:
```
<script src="https://js.pay-cross.com/cse/v.1.0.0/begateway-cse.min.js"></script>
```
Файл с библиотекой begateway-cse.min.js загружается с серверов PayCross.
Создайте объект begateway в отдельном script блоке и передайте ваш публичный ключ в его конструктор:
```
<script>var begateway = new BeGatewayCSE ("YOUR_PUBLIC_KEY"); </script>
```
Замените YOUR_PUBLIC_KEY вашим RSA публичным ключом, который можно найти в личном кабинете PayCross.

2. Настройте веб-форму

Добавьте в форме атрибут data-encrypted-name к полям, которые вы хотите зашифровать. Значение атрибута data-encrypted-name будет использовано библиотекой в дальнейшем.

Info

Данные поля не должны иметь атрибут name=. Это гарантирует, что введенные значения в этих полях не будут переданы на ваш сервер.

<form method="POST" action="#handler" id="begateway-encrypted-form">
    <input type="text" size="20" autocomplete="off" data-encrypted-name="encrypted_number" />
    <input type="text" size="20" autocomplete="off" data-encrypted-name="encrypted_holder" />
    <input type="text" size="2" maxlength="2" autocomplete="off" data-encrypted-name="encrypted_exp_month" />
    <input type="text" size="4" maxlength="4" autocomplete="off" data-encrypted-name="encrypted_exp_year" />
    <input type="text" size="4" maxlength="4" autocomplete="off" data-encrypted-name="encrypted_verification_value" />
    <input type="submit" value="Оплатить" id="submit-button" />
</form>

В том же блоке, где вы создали объект begateway, добавьте код, похожий на код из примера ниже, чтобы произвести шифрование данных при нажатии на кнопку Оплатить:
```
<script>
  document.getElementById("submit-button").addEventListener("click", function(){ begateway.encrypt("begateway-encrypted-form"); });
</script>
```
где begateway-encrypted-form - это ID формы.

Данный код сообщает библиотеке begateway-cse.js, где искать поля формы с data-encrypted-name атрибутом.

Детальное описание процесса шифрования при нажатии кнопки "Оплатить"

Каждое поле формы с атрибутом data-encrypted-name автоматически шифруется на устройстве клиента.
Для каждого поля формы с атрибутом data-encrypted-name создаются скрытые поля с именем, взятым из значения атрибута data-encrypted-name, а значением поля является шифрованная строка введенных данных.
В форме создается дополнительное скрытое поле, названное credit_card_last_4, которое содержит последние 4 цифры введенного номера карты.
Удаляется атрибут name у полей с атрибутом data-encrypted-name, чтобы не шифрованная информация не попала в ваш сервис.
Форма, с созданными скрытыми полями и полями без атрибута data-encrypted-name, отправляется к вам на сервер.

Запрос с зашифрованной информацией

Как только вы получили шифрованные данные, вы можете их использовать для осуществления операций оплаты или авторизации.

Для этого отправьте шифрованные данные с номером карты, именем на карте, сроком действия карты и кодом CVC в JSON-сообщении операций авторизация, оплата и токенизации:

"encrypted_credit_card" : {
  "number":"<encrypted-data-here>",
  "holder": "<encrypted-data-here>",
  "exp_month" : "<encrypted-data-here>",
  "exp_year" : "<encrypted-data-here>",
  "verification_value" : "<encrypted-data-here>"
}

Для токенизации карты получателя передайте шифрованные данные номера карты, имени на карте, срока действия карты как значение параметра encrypted_recipient_credit_card в JSON-сообщении операции:

"encrypted_recipient_credit_card" : {
  "number":"<encrypted-data-here>",
  "holder": "<encrypted-data-here>",
  "exp_month" : "<encrypted-data-here>",
  "exp_year" : "<encrypted-data-here>"
}

Info

В целях усиления безопасности для отправки данных формы используйте метод POST вместо GET. Дополнительно проверьте, что вы не сохраняете конфиденциальную информацию в куки.

Пример передачи зашифрованных данных в запросе на оплату

{
  "request":{
      "amount":100,
      "currency":"USD",
      "description":"CSE test transaction",
      "tracking_id":"your_uniq_number",
      "encrypted_credit_card":{
        "number": "$begatewaycsejs_1_0_0$uiutvhc05b8e1f6KX95OloXGJvFHn4KHicAHTVWW5jiUcq8DvPeKPd6rTLuX8XL2FXivnz246f8aD7tBvO7ewn5GrHDmCvqPczbYI/b/gzBBTHJQp5hEDB3Xzjr4wXviMXCi8zD2IR10u5LHPFtgvRneJ1NUJxveKoSxy0iH2frja+MEHHK8KOAHM6vQNvqttsBWZH8bx1jZTV/2lJ1uVfSBXcfBDAqoVNqllq5PKI5rE0p/drkpPKleLgkU987QEYDGIozBIMgQWtz0knZjSms2J0yootnJGEAqXAFlaOnS3ITyCULZFOrdUOvH3kuA5OF+IEoelQDBhsiVosCpQw==",
        "holder" : "$begatewaycsejs_1_0_0$p7Dny0JykJHExz8C1Z4kWLtFTC9/GBX66kK2cvh1a3yV6eSkYxnvkCKtmTRfL2CV0bcQC8EFrV6//B9DEk6TVmUl+CFt/b7kPReneonA2LFqLNG1kOBJqRQ+HW40jZqNemeyWP7Y8pRGMgh93FYwxZ/5vHEyVC2G6tXMNDSAEyJGs5ZPcPKQFNYr5WR1F/rEQwP8ZH3YOHoxFKOCSRsgevxfKncBSWHbyPZ9zHUlgi11fhebOx08/l1DmzF16eMWEm8kKQFCWkoFBrhcTdup7AIlkq4gihyGJEMBqRREhxQ27ZaArJkbKdl1d1NZdF/8t201vzy9aMMs0y/OpZ1iOA==",
        "exp_month" : "$begatewaycsejs_1_0_0$k62AQJrpirKtcHIruIcsYJf77WXXrnS08e6R76Yh5N3B+7cVQMy7Uoh1CjfjYFEuGOcDOzWt/TA3TyrdQ5Ni60tfc06LY//gtqwCy06YY0WXKv7s8wUAZOEurpUk+uRfIyMqJnViOBcoctULqZAzKh+bBhq8OcpgbFqxnXs+X554oHXcGTdso62jzUICHPvrmzoom/Fw/sodyUufbLORnH5NfpQC6O+yeIWxBcDDY03+psCJEa0Kf7l8IIAaN/34YcXRw8vuTtd6P+fNGroU/Nk/KQSxbikdkGQ2Ov29QfsHN7/UF1H0dMpW37Aqums7F0x64m+oHsHEBWH5rzYa6Q==",
        "exp_year" : "$begatewaycsejs_1_0_0$DHQBwgbYBR7R68erc+ZPuqk1eIOFUJvPCzAAdto9nxnLkTU6RaZCiRA+RyUJQIpnL1LuobABF1sccCS3ykOMkhqHLPAG6vkiewenP03krVI30Zw1SbGxL1xD99z5PAWtDjsKQjWvF/srppFd77T9zwbcrbbREwa0MIp2miCDy9Lx46m3M3d89A1NQAqWRxGTVNq3Lk2nhFHqXuLzIwkCxiCmmFUbtvR50Q/RjA/+KnFlzR8/HbAVQZQz34DHfL4Z5A9pO8zmjXwZDgPFc0XCEW25b0eogdXF95YfLAJuyrzSNLmbDkbyK5cZoOHXR92rdw9g1aILfv27rowNXp2nCQ==",
        "verification_value":"$begatewaycsejs_1_0_0$Ws52vhIxC3Cxhtb/OiMmoF0yxHbomKo2SmuPUcKGKO0xKjQs3+d80MV8tAoPiMW8gfta3YshKuJuFmLc3pww4yA7I3kR1HoeUX5JiD602cGtff9H7jthSgMHYBIIKxsmDs5NXGvZ857Z62q3U0CY4+QcToVbXcKg741vk7pkIpW/litaQC+yFVCq12FSCJudpphG45RaJNl7vBt6YJzkUKKOyLyD7iZXRNa6AAxiY/bqA0le+70e3J119jB5X0r2G0EPfBUXcDApzHffEY2F4cvE9moZP61vFlYt2EoZoBHicY5v7HW1YyBZlCf9DZa+mxl+lQ05ODFf1LaaWvFBfw=="
      }
  }
}