Añadir Script en Frontend
Contamos con dos formas de integrar el SDK de menta tech en tus páginas de Frontend.
Para tener un mejor resultado y poder prevenir contracargos con la mayor efectividad posible, es necesario que incluyas el código en todas las páginas de tu plataforma.
Instalación vía npm
Puedes descargar nuestro SDK de Frontend directamente en tu aplicación utilizando npm o yarn.
- npm
- yarn
npm install @mentatickets/ts-sdk
yarn add @mentatickets/ts-sdk
Luego para inicializar el cliente, debes utilizar el siguiente código:
import { initializeMentaTickets } from "@mentatickets/ts-sdk";
const mentatickets = initializeMentaTickets(tu_PUBLIC_api_key)
// Cargamos Paysecure en el navegador del usuario
mentatickets.paySecure.load("Your_User_Session_ID", "Your_User_ID", "User_Flow")
Instalación vía CDN
En caso que no cuentes con un sistema de build en tu aplicación, puedes utilizar el SDK de menta tech directamente desde nuestro CDN. Sólamente tienes que incluir la siguiente etiqueta script en el <head> de tu aplicación:
<script src='https://cdn.jsdelivr.net/npm/@mentatickets/ts-sdk/dist/index.min.js'>
Luego para inicializar el cliente, debes utilizar el siguiente código:
const mentatickets = window.mentatickets.initializeMenta(tu_PUBLIC_api_key)
mentatickets.paySecure.load("Your_User_Session_ID", "Your_User_ID", "User_Flow")
Reemplaza los valores de ejemplo
Recuerda reemplazar los valores de ejemplo por los valores reales de tu aplicación. Para ello, debes reemplazar los siguientes valores:
tu_PUBLIC_api_key: Este valor te lo proporcionamos nosotros. Es un valor único que identifica a tu aplicación de forma pública y no es necesario que lo mantengas en secreto.Your_User_Session_ID: Este valor debe ser un identificador único de la sesión actual de tu usuario.Your_User_ID: Este valor debe ser un identificador único de tu usuario.User_Flow: Este valor debe ser el nombre de la página actual de tu usuario. Por ejemplo, si tu usuario está en la página de checkout, debes enviar el valorcheckout_flow. A continuación te dejamos una lista con los valores posibles:
home, event_page, cart, search, checkout_start, checkout_flow
checkout_review, checkout_success, checkout_failure, ticket
Recuerda que la API Key Pública no debe ser compartida con nadie, y debe ser utilizada únicamente en el frontend de tu plataforma.
¡Listo! Ya tienes el SDK de menta tech instalado en tu aplicación. Recuerda inicializarlo y usarlo en todas las páginas de tu aplicación.
Actualizar página actual
Si utilizas una SPA, es necesario que nos envíes la información de la página actual cada vez que cambie. Para ello, puedes utilizar el siguiente código:
mentatickets.updatePage("checkout_flow")
ó si incorporas el SDK usando CDN, utiliza el siguiente código:
window.mentatickets.updatePage("checkout_flow")
Valores de currentPage
| Valor | Descripción |
|---|---|
home | Página principal de tu plataforma |
event_page | Página de visualización de un evento |
cart | Página de visualización del carrito |
search | Página de búsqueda de eventos |
checkout_start | Página de inicio de checkout |
checkout_flow | Páginas intermedias de checkout |
checkout_review | Páginas de revisión de checkout |
checkout_success | Página de éxito de compra |
checkout_failure | Página de fallo de compra |
ticket | Página de visualización de un ticket |
Sabemos que es posible que no cuentes con todas estas páginas en tu plataforma, por lo que puedes enviarnos únicamente las que tengas.