Cuenta de Mercado Pago
La opciĂłn de pagar con Cuenta de Mercado Pago, por defecto, se presenta en todos los Checkouts de Mercado Pago en combinaciĂłn con los pagos de los usuarios invitados (sin login).
Esta opción permite a los usuarios registrados en Mercado Pago y/o Mercado Libre iniciar sesión y utilizar los métodos disponibles para realizar sus pagos, ademås de poder incluir nuevas opciones de pago, como tarjetas de crédito.
Es posible pagar con tarjeta, saldo disponible y Linha de CrĂ©dito en un entorno seguro y optimizado, aumentando las posibilidades de conversiĂłn de ventas, ademĂĄs de permitir al vendedor ofrecer Ășnicamente pagos con Cuenta de Mercado Pago. Con esto, la opciĂłn de pagar sin iniciar sesiĂłn no existirĂĄ, sin embargo, contribuirĂĄ a un aumento en la conversiĂłn de pagos.
Sigue los pasos a continuación para configurar el Cuenta de Mercado Pago como método de pago.
Crear preferencia
Server-Side
Si eres un usuario y deseas que todos tus pagos se realicen a través de Wallet, puedes determinarlo a través de un atributo en la llamada a la API de preferencias. Para crear una preferencia, usa uno de los SDK disponibles a continuación.
purpose
y el valor wallet_purchase
al endpoint
/checkout/preferences
y ejecuta el request o, si lo prefieres, usa uno de los SDK a continuaciĂłn.
<?php
// Crea un objeto de preferencia
$preference = new MercadoPago\Preference();
// Crea un Ătem en la preferencia
$item = new MercadoPago\Item();
$item->title = 'Mi producto';
$item->quantity = 1;
$item->unit_price = 75;
$preference->items = array($item);
$preference->purpose = 'wallet_purchase';
$preference->save();
?>
El modo Cuenta de Mercado Pago funciona añadiendo el atributo purpose en la preferencia.
// Crea un objeto de preferencia
let preference = {
items: [
{
title: 'Mi producto',
unit_price: 100,
quantity: 1,
}
],
purpose: 'wallet_purchase'
};
mercadopago.preferences.create(preference)
.then(function(response){
global.id = response.body.id;
}).catch(function(error){
console.log(error);
});
El modo Cuenta de Mercado Pago funciona añadiendo el atributo purpose en la preferencia.
// Crea un objeto de preferencia
PreferenceClient client = new PreferenceClient();
// Crea un Ătem en la preferencia
PreferenceItemRequest item =
PreferenceItemRequest.builder()
.title("Mi producto")
.quantity(1)
.unitPrice(new BigDecimal("75"))
.build();
MercadoPagoConfig.setAccessToken("YOUR_ACCESS_TOKEN");
List<PreferenceItemRequest> items = new ArrayList<>();
items.add(item);
PreferenceRequest request =
PreferenceRequest.builder().items(items).purpose("wallet_purchase").build();
client.create(request);
El modo Cuenta de Mercado Pago funciona añadiendo el atributo purpose en la preferencia.
sdk = Mercadopago::SDK.new('ENV_ACCESS_TOKEN')
# Crea un objeto de preferencia
preference_data = {
items: [
{
title: 'Mi producto',
unit_price: 100,
quantity: 1
}
],
purpose: 'wallet_purchase'
}
preference_response = sdk.preference.create(preference_data)
preference = preference_response[:response]
# Este valor substituirĂĄ a la string "<%= @preference_id %>" en tu HTML
@preference_id = preference['id']
El modo Cuenta de Mercado Pago funciona añadiendo el atributo purpose en la preferencia.
// Crea el objeto de request de la preferencia
var request = new PreferenceRequest
{
Items = new List<PreferenceItemRequest>
{
new PreferenceItemRequest
{
Title = "Mi producto",
Quantity = 1,
CurrencyId = "BRL",
UnitPrice = 75m,
},
},
Purpose = "wallet_purchase",
};
// Crea la preferencia
var client = new PreferenceClient();
Preference preference = await client.CreateAsync(request);
preference_data = {
"items": [
{
"title": "Mi producto",
"unit_price": 100,
"quantity": 1
}
],
"purpose": "wallet_purchase"
}
preference_response = sdk.preference().create(preference_data)
preference = preference_response["response"]
Añadir checkout
Client-Side
Después de haber creado la preferencia en el backend, para adicionar el botón de pago serå necesario instalar el SDK de frontend de Mercado Pago en el proyecto.
La instalaciĂłn se hace en dos etapas: primero, incluyendo el SDK de Mercado Pago en el proyecto con tus credenciales configuradas, y luego, iniciando el checkout a partir de esa preferencia generada anteriormente. Para esto, sigue los pasos listados debajo.
- Para incluir el SDK MercadoPago.js, agrega el cĂłdigo disponible debajo en el HTML del proyecto, o instĂĄlalo vĂa NPM de acuerdo a lo indicado en los ejemplos a continuaciĂłn.
<body>
<script src="https://sdk.mercadopago.com/js/v2"></script>
</body>
npm install @mercadopago/sdk-js
Luego, inicializa la integraciĂłn al definir tu clave pĂșblica usando el siguiente cĂłdigo.
<script>
const mp = new MercadoPago("YOUR_PUBLIC_KEY");
</script>
import { loadMercadoPago } from "@mercadopago/sdk-js";
await loadMercadoPago();
const mp = new window.MercadoPago("YOUR_PUBLIC_KEY");
A continuaciĂłn, es necesario que crees un container para definir la ubicaciĂłn que el botĂłn tendrĂĄ en la pantalla. La creaciĂłn de este container se hace insertando un elemento en el cĂłdigo HTML de la pĂĄgina en la que el componente serĂĄ renderizado.
<div id="wallet_container"></div>
- Al finalizar la etapa anterior, inicializa tu checkout utilizando el ID de la preferencia previamente creada con el identificador del elemento donde el botĂłn deberĂĄ ser exhibido.
mp.bricks().create("wallet", "wallet_container", {
initialization: {
preferenceId: "<PREFERENCE_ID>",
},
});
Al crear un pago es posible recibir 3 estados diferentes: Pendiente
, Rechazado
y Aprobado
. Para mantenerse al dĂa con las actualizaciones, debe configurar su sistema para recibir notificaciones de pago y otras actualizaciones de estado. Consulte Notificaciones para obtener mĂĄs detalles.
El modo Cuenta de Mercado Pago funciona añadiendo el atributo purpose en la preferencia.