Ir al contenido principal

Como utilizar la API de Mercado Pago con Javascript en 2024

Primero que nada, me gustaría aclarar que este artículo no va a ser un tutorial paso a paso sobre cómo utilizar la API de Mercado Pago. Eso ya lo hice en video y aca te los dejo.

Te los recomiendo. De hecho, después de estos, hay más videos en mi canal sobre cómo integrar el checkout de Mercado Pago como un modal o con distintos tipos de redirecciones, así como también cómo capturar información un pago exitoso.


Por otro lado, me gustaría elaborar una guía sobre cómo utilizar la versión anterior de esta API. Esto está destinado principalmente a ayudar a aquellas personas que hayan visto mis videos sobre esta API en mi canal de YouTube, pero aquellos que se encuentren desactualizados y estén buscando aprovechar esos proyectos sin necesidad de modificar el código de mercado pago a la última versión como se muestra en los vídeos que compartí más arriba.


Dejo acá el link directo a los videos que han quedado desactualizados para que tengas a mano el tutorial que estés siguiendo.


Integración Mercado Pago con Javascript: ver video


Integración Mercado Pago con ReactJs: ver video


Proyecto Donaciones Mercado Pago Javascript: ver video ver video


Proyecto Donaciones Mercado Pago ReactJs: ver video


Ecommerse principiantes Mercado Pago Javascript: ver video ver video


Solucionando conflictos de versión de Mercado Pago

Lo que se debe hacer es asegurarse de tener alguna versión compatible de mercado pago en lugar de tener la ultima versión que se te instale por defecto. Nada mas que eso, el resto del código queda tal cual.

Para ello deber is a tu archivo Package.json y buscar dentro de la llave ''dependencies'' que versión de mercado pago se instalo por defecto. Posiblemente sea la 2.0.4 o incluso alguna superior.

Esto hace que al correr el servidor nos de seguramente algun error quizas algo asi como: ''mercadopago.configure is not a function''

Esto es por que las ultimas versiones de mercado pago no resisten configure como manera optima para vincular las credenciales de nuestra cuenta.


Entonces hay que modificar la línea del archivo package.json y colocar una versión de Mercado Pago adecuada.


Coloca en tu archivo package.json la version "^1.5.17" de Mercado Pago.


Ahora hay que eliminar la capeta node modules y el archivo package-lock.json de tu código. Una ves hecho esto hay que volver a instalar las dependencias del proyecto, en nuestro caso mercadopago cors y express.


Corre el siguiente comando en la consola:


npm install mercadopago cors express


Perfecto esto es todo!


Ya podes seguir el tutorial y el codigo te va a funcionar perfecto


Saludos!

Comentarios

Entradas populares de este blog

Buscador y filtrado de productos en Javascript

Vamos a crear en este articulo un buscador y filtrado de productos en JavaScript paso a paso. Te voy a ir dejando el código limpio para que puedas copiarlo y probarlo en tu proyecto junto con explicaciones. Te dejo también el video de este tutorial por si te interesa tenerlo a mano. ¡No te olvides de suscribirte a mi canal! ♥️. 1) El HTML del buscador del productos en javaScript <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" href="styles.css" /> <title>Document</title> </head> <body> <h1>BUSCAR PRODUCTOS</h1> <!-- search content --> <div class="search-container"> <input type="text" id="searchInput" placeholder="Search products..." /> ...

Como deployar proyecto Backend con Node.js y Expess.js en Vercel

Se hace bastante simple deployar un proyecto backend con NodeJS y Express en vercel, solo hay que tener en cuenta algunas pocas cosas! te lo voy a ir mostrando en este articulo paso paso, dejándote también el código de ejemplo para que te lo puedas copiar y probar en tu proyecto. Te dejo también el paso a paso en video, no te olvides de suscribirte a mi canal ❤️ Preparando proyecto para deployar en Vercel Vamos a comenzar creando un proyecto simple para deployar, en tu editor de código crea una carpeta llamada app. Dentro de esta carpeta corre el siguiente comando en la consola: npm init -y Esto va a crear un archivo package.json con información básica y necesaria del proyecto. Ahora, dentro de nuestra carpeta app hay que crear otro archivo al cual lo vamos a llamar index.js, es importantísimo que se llame index.js y no de otra forma como app.js o server.js, vercel va a buscar un archivo que se llame index.js a la hora de deployar el código. Entonces la estructura tiene que ir que...

Append vs AppendChild en Javascript ¿ Cuál utilizar ?

No comprendo por que usas append y no appendChild. Hace poco recibí este comentario en uno de mis videos de YouTube en donde muestro como ir paso a paso creando la lógica de un E-commerce con JavaScript. Aquí el video para quien le interese: En verdad esto me motivo a escribir este articulo para explicar la diferencia entre ambos y comentar cual es conveniente utilizar. ¿Qué son append y appendChild? Append y appendChild en JavaScript son metodos para manipular el DOM (es decir: el Document Objet Model). Ambos tienen la facultad de agregar elementos al DOM pero tienen enfoques ligeramente diferentes. El método appendChid Su tarea principal es agregar un único nodo como hijo al final de otro nodo existente. Para utilizarlo, primero hay que seleccionar el nodo al que deseas agregar un hijo y luego llamar a appendChild. Un ejemplo con appendChild() const parent = document.getElementById("parentElement"); const child = document.createElement("div"); parent.appendChil...