O moip-assinaturas.min.js é uma biblioteca JavaScript feita para facilitar a integração do Moip Assinaturas com o seu site, permitindo o desenvolvimento do seu próprio fluxo de contratação sem que seu cliente precise sair do seu ambiente, assim como funciona o Checkout Transparente do Moip. Além de possuir uma estrutura de validações pré-definidas, utilizando essa biblioteca você também reduz o seu escopo para o PCI, uma vez que os dados de cartão de crédito vão direto do navegador do seu cliente para o Moip.
O Moip Assinaturas dispõe de dois ambientes: SANDBOX e PRODUÇÃO, permitindo flexibilidade entre testes de homologação e ambiente real.
A biblioteca possui dependência do jQuery, portanto, é importande adicioná-la antes de realizar a importação da biblioteca JS do Moip Assianturas
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> <script src="https://[sandbox ou api].moip.com.br/moip-assinaturas.min.js" type="text/javascript"></script>
Todos os serviços do Moip Assinaturas são autenticados e deve ser informada na hora de instânciar um objeto do tipo MoipAssinaturas(). Sua chave pública é seu Token Moip.
Exemplo:
var moip = new MoipAssinaturas("SEU_TOKEN");
O Moip assinaturas utiliza os mesmo token e key disponíveis em sua Conta Moip. Assim, não só estamos unificando as chaves, como estamos mantendo integradas as contas do Moip e do Moip Assinaturas.
Para obter seu token e key, siga os procedimentos abaixo:
A criação de uma assinatura prevê a existência de um cliente, para criá-lo basta instânciar o objeto
new Customer() conforme exemplo.
O cliente possui as informações pessoais do assinante (nome, e-mail, código do cliente, cpf,
data de nascimento, etc), o endereço new Address()(rua, numero, bairro, etc)
e o os dados de cobrança new BillingInfo()(cartão de crédito).
O primeiro passo para a utilização do moip-assinaturas.min.js é instanciar o objeto
new MoipAssinaturas('SEU_TOKEN'), essa classe JavaScript é responsável por realizar a
integração com o Moip Assinaturas. Em seu construtor, ela recebe apenas o seu token de autorização.
O metódo MoipAssinaturas.subscribe é responsavel por criar uma nova assinatura com um novo cliente.
Ele recebe como parâmetro um objeto new Subscription() contendo como parâmetros o código da assinatura,
o novo cliente (criado atráves do objeto Customer) e o código do plano.
Abaixo há um exemplo de um JavaScript para gerar uma assinatura.
var moip = new MoipAssinaturas("SEU_TOKEN");
var customer = build_customer();
var plan_code = $("#plan_code").val();
moip.subscribe(
new Subscription()
.with_code(new Date().getTime())
.with_new_customer(customer)
.with_plan_code(plan_code);
).callback(function(response){
if (response.has_errors()) {
for (i = 0; i < response.errors.length; i++) {
var erro = response.errors[i].description;
$("#erros").append(erro);
}
return;
}
alert("Assinatura criada com sucesso")
});
var build_customer = function() {
var customer_params = {
fullname: $("#fullname").val(),
email: $("#email").val(),
code: new Date().getTime(),
cpf : $("#cpf").val(),
birthdate_day : $("#birthdate_day").val(),
birthdate_month: $("#birthdate_month").val(),
birthdate_year: $("#birthdate_year").val(),
phone_area_code: $("#ddd").val(),
phone_number: $("#phone").val(),
billing_info: build_billing_info(),
address: build_address()
}
return new Customer(customer_params);
};
var build_billing_info = function() {
var billing_info_params = {
fullname : $("#holder_name").val(),
expiration_month: $("#expiration_month").val(),
expiration_year: $("#expiration_year").val(),
credit_card_number: $("#credit_card").val()
};
return new BillingInfo(billing_info_params);
};
var build_address = function() {
var address_params = {
street: $("#rua").val(),
number: $("#numero").val(),
complement: $("#complemento").val(),
district: $("#bairro").val(),
zipcode: $("#cep").val(),
city: $("#cidade").val(),
state: $("#estado").val(),
country: "BRA"
};
return new Address(address_params);
};
Veja detalhes de informações do cliente na documentação API de cliente
Para criar um cliente com dados de cartão sem relacioná-lo a uma assinatura, o processo é semelhante. Você cria um new Customer() e instância o objeto new MoipAssinaturas('SEU_TOKEN'), porém, você deverá chamar o método MoipAssinaturas.create_customer(). Nesse caso, apenas o cliente será criado e não estará associado a nenhuma assiantura.
var token = "MEU_TOKEN";
var customer = new Customer(); // Especifique todos os atributos de um Customer
moip = new MoipAssinaturas(token);
moip.create_customer(customer)
.callback(function(response){
if (response.has_errors()) {
for (i = 0; i < response.errors.length; i++) {
var erro = response.errors[i].description;
$("#erros").append(erro);
}
return;
}
alert("Cliente criado com sucesso");
});
Para atualizar os dados de cartão de um cliente é necessário construir um objeto Customer() onde obrigatoriamente deve haver o código do cliente no qual você deseja atualizar os dados de cartão e a nova BillingInfo() com os novos dados de cobrança.
var token = "MEU_TOKEN";
var moip = new MoipAssinaturas(token);
var customer = new Customer();
customer.code = "cliente01"; // Código identificador do seu cliente
customer.billing_info = new BillingInfo(); // Especifique um novo cartão para fazer a cobrança
moip.update_credit_card(customer).callback(function(response){
if (response.has_errors()) {
for (i = 0; i < response.errors.length; i++) {
var erro = response.errors[i].description;
$("#erros").append(erro);
}
return;
});;
Personalizando o retorno do Moip Assinaturas.
Assim que o Moip Assinaturas concluir a sua requisição o metódo de callback é executado. Isto é útil para você dar sequência ao seu checkout ou mesmo exibir mensagens de erros para o cliente ao preencher o formulário de pagamento.
Para que possamos chamar seu metódo de callback, é necessário que você passe o bloco de função para o metódo callback.
var moip = new MoipAssinaturas("SEU_TOKEN");
moip.callback(function(response){
// aqui você adiciona os seus comportamentos esperados
});
O Moip Assinaturas irá chamar seu callback passando como parâmetro um objeto Response(). Ele contém uma lista de possíveis
erros da integração ou de informações preenchidas pelo seu cliente no checkout. O Response() também possui uma lista de
alertas que auxiliam você na sua integração.
{
"code": "ass_homolog_72",
"amount": "100",
"next_invoice_date": {
"day": "05",
"month": "01",
"year": "2013"
},
"status": "ACTIVE",
"plan": {
"name": "Plano de homologação",
"code": "homolog1"
},
"customer": {
"email": "fulano@homolog.com",
"code": "homolog2",
"fullname": "Fulano Homologador"
},
"invoice": {
"id": 134,
"moip_id": "14000000",
"amount": 110,
"status": {
"description": "Em análise",
"code": 2
}
},
"message": "Assinatura criada com Sucesso",
"errors": [],
"alerts": [
{
"code": "MA90",
"description": "O nome do portador do cartão deve ter no máximo 45 caracteres. Os demais caracteres serão ignorados"
}
]
}
Para verificar se há erros ou alertas na resposta do Moip Assinaturas, basta chamar o metódos has_errors()
ou has_alerts().
var moip = new MoipAssinaturas("SEU_TOKEN");
moip.callback(function(response){
alert(response.has_errors());
alert(response.has_alerts());
});