Criptografia do cartão de crédito

Para aumentar a segurança das transações a API Moip trabalha com o conceito de criptografia ponta-a-ponta. Isto é, os dados sensíveis de cartão de crédito são criptografados nas aplicações clientes (browser, apps nativos) e somente são descriptografados nos servidores do Moip. Isso é importante para evitar que o seu comprador fique exposto à interceptação da mensagem. Veja abaixo o passo-a-passo de como realizar criptografia nos principais clientes.

Obtendo uma chave pública

O primeiro passo para criptografar o cartão de crédito é obtendo uma chave pública. As chaves públicas de criptografia são disponibilizadas dentro de sua Conta Moip. Acesse pelo link da conta de sandbox ou de produção caso você já tenha passado pelo processo de homologação e esteja nos últimos detalhes para transacionar de verdade.

Criptografia no Browser

Como o Moip.js é uma biblioteca client-side e está disponível em nosso GitHub, você deve utilizá-lo caso esteja fazendo a criptografia dos dados do cliente no browser ou em apps que rodem em frameworks html5 (Ionic, Meteor, etc.). Para integrações em ambientes Mobile você deve criptografar os dados usando nossos sdks (Android e iOS).

Para fazer a criptografia dos dados do seu cliente, primeiramente importe o Moip.js:

<script type="text/javascript" src="//assets.moip.com.br/v2/moip.min.js"></script>

Você também deve incluir o script que fará a criptografia em sua página:

<script type="text/javascript">
    $(document).ready(function() {
        $("#encrypt").click(function() {
          var cc = new Moip.CreditCard({
            number  : $("#number").val(),
            cvc     : $("#cvc").val(),
            expMonth: $("#month").val(),
            expYear : $("#year").val(),
            pubKey  : $("#public_key").val()
          });
          console.log(cc);
          if( cc.isValid()){
            $("#encrypted_value").val(cc.hash());
          }
          else{
            $("#encrypted_value").val('');
            alert('Invalid credit card. Verify parameters: number, cvc, expiration Month, expiration Year');
          }
        });
    });
  </script>

Com o Moip.js em sua página, basta que você crie os campos de seu checkout referênciando o script que irá fazer a criptografia dos dados do pagamento.

Formulário HTML

Insira a sua chave pública em um campo com o id correspondente na sua função que faz a comunicação com o Moip.js.

<textarea id="public_key" style="display:none;">
  -----BEGIN PUBLIC KEY-----
MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAsXkulsKdAQLMH/zjzTLf
0lrbgulfb6ZShEtRpmDnyX93EQqPdez7LyptvQBeTC+0pN57rNcWen9ApdsIMsNr
YHjNQf/kI4Ka7Xnlx0U/v7bW1D8teDoD5glBTXLjU8hRi7qlOpupiPx4ldSnK9Jj
tYApWuZMiCpWh/YRAlNW/N+ffm7ulq6H2atmgd+OFB2SghpbRJkqJiLaNJW8UkaR
oXLHkF5WJD/RPrCxsZztYJQThxLX5gBgZ12YG5+7G26Ad/mWkPqF0GLSkd1gcnbP
vF9Nw3ckKaIvh4Q4Vp3XI1hLvX41lg9CBxPPHkiJwM1M1coF9xsMP7kpJ2eujMBd
mwIDAQAB
-----END PUBLIC KEY-----</textarea>

Você também deve criar um campo referente a cada parâmetro que devem ser enviados para o Moip:

<input type="text" placeholder="Credit card number" id="number"/>
<input type="text" placeholder="CVC" id="cvc"/>
<input type="text" placeholder="Month" id="month"/>
<input type="text" placeholder="Year" id="year" />

📘

Os campos citados acima não precisam seguir uma ordem específica.

Com os dados criptografados, você receberá o hash dos dados do cartão de crédito do cliente cc.hash() que será utilizado no momento do pagamento.

👍

DICA

Você pode ver um exemplo funcional de criptografia usando o Moip.js clicando aqui.

🚧

IMPORTANTE

Criamos SDKs para facilitar a criptografia dos dados do cartão de seu cliente em apps Android e iOS. Para saber mais como fazer a criptografia usando meios mobile, por favor, veja mais informações em nossa Documentação.