Inicializar componente

Cuando se crea una nueva instancia del componente es necesario un objeto de configuración con las propiedades nonce (valor de seguirdad para intercambiar por un token), payload (información de la transacción a procesar) y settings (configuraciones de formulario).

Parámetros

Campo	Obligatorio	Tipo	Descripcion
`nonce`	Si	Alfanumerico	Codigo encriptado que contiene el valor de la key del comercio, debe ser generado en el backen desde el servicio OAuth de Alignet API Nonce
`payload`	Si	Objeto JSON	JSON con los detalles necesarios para inicializar el formulario: datos de la compra datos del comprador
`display_settings`	No	Objeto	Configuraciones de visualización de formulario
`display_settings.methods`	No	Array de String	Métodos de pago a mostrar. Valores posibles: CARD YAPE QR BANK_TRANSFER CUOTEALO *Si no se envia, se mostrarán todos los métodos habilitados para el Comercio por defecto.

Objeto payload

El objeto payload mantiene la misma estructura de API de Autorizacion sin incluir el objeto payment_method:

Field	Description	Accepted Value	Type	Obligatorio
`action`	Acción a ejecutar	authorize	`String`	SI
`channel`	Canal donde se ejecutara la transacción	ecommerce	`String`	SI
`merchant_code`	Identificador del comercio	Cadena Alfanumérica	`String`	SI
`merchant_operation_number`	Número de pedido de la operación	Cadena numérica mayor o igual de 6 dígitos	`String`	SI
`payment_details`	Objeto con información de la transacción		`Object`	SI
`payment_details.amount`	Monto en centavos de la operación. La separación de decimales se aplicará según la moneda. Ej.: Para S/. 10.50, se debe enviar “1050” y en currency “604” para Soles.	Cadena numérica	`String`	SI
`payment_details.currency`	Código ISO-3 de la moneda de la operación(Falta el link al ISO)	Cadena numérica	`String`	SI
`payment_details.additional_fields`	Diccionario para enviar campos y valores personalizados segun `key:value`. Ej.: external_id:5468724		`Dictionary`	NO
`payment_details.customer`	Objeto con información del cliente que realiza la compra			NO
`payment_details.customer.first_name`	Nombres	Cadena alfanumérica	`String`	NO
`payment_details.customer.last_name`	Apellidos	Cadena alfanumérica	`String`	NO
`payment_details.customer.email`	Correo electrónico	Cadena alfanumérica	`String`	NO
`payment_details.customer.phone`	Objeto con información del teléfono		`Object`	NO
`payment_details.customer.phone.country_code`	Código del pais del teléfono	Cadena numérica	`String`	NO
`payment_details.customer.phone.subscriber`	Número del teléfono	Cadena numérica	`String`	NO
`payment_details.customer.location`	Objeto con información de la persona		`Object`	NO
`payment_details.customer.location.line_1`	Dirección 1	Cadena alfanumérica	`String`	NO
`payment_details.customer.location.line_2`	Dirección 2	Cadena alfanumérica	`String`	NO
`payment_details.customer.location.city`	Ciudad	Cadena alfanumérica	`String`	NO
`payment_details.customer.location.state`	Estado	Cadena alfanumérica	`String`	NO
`payment_details.customer.location.country`	Pais	Cadena alfanumérica	`String`	NO
`payment_details.billing`	Objeto con información de facturación		`Object`	SI
`payment_details.billing.first_name`	Nombres	Cadena alfanumérica	`String`	SI
`payment_details.billing.last_name`	Apellidos	Cadena alfanumérica	`String`	SI
`payment_details.billing.email`	Correo electrónico	Cadena alfanumérica	`String`	SI
`payment_details.billing.phone`	Objeto con información del teléfono		`Object`	SI
`payment_details.billing.phone.country_code`	Código del pais del teléfono	Cadena numérica	`String`	SI
`payment_details.billing.phone.subscriber`	Numero del teléfono	Cadena numérica	`String`	SI
`payment_details.billing.location`	Objeto con información de la persona		`Object`	SI
`payment_details.billing.location.line_1`	Dirección 1	Cadena alfanumérica	`String`	SI
`payment_details.billing.location.line_2`	Dirección 2	Cadena alfanumérica	`String`	NO
`payment_details.billing.location.city`	Ciudad	Cadena alfanumérica	`String`	SI
`payment_details.billing.location.state`	Estado	Cadena alfanumérica	`String`	SI
`payment_details.billing.location.country`	Pais	Cadena alfanumérica	`String`	SI
`payment_details.shipping`	Objeto con información de envío		`Object`	NO
`payment_details.shipping.first_name`	Nombres	Cadena alfanumérica	`String`	NO
`payment_details.shipping.last_name`	Apellidos	Cadena alfanumérica	`String`	NO
`payment_details.shipping.email`	Correo electrónico	Cadena alfanumérica	`String`	NO
`payment_details.shipping.phone`	Objeto con información del teléfono		`Object`	NO
`payment_details.shipping.phone.country_code`	Código del pais del teléfono	Cadena numérica	`String`	NO
`payment_details.shipping.phone.subscriber`	Numero del teléfono	Cadena numérica	`String`	NO
`payment_details.shipping.location`	Objeto con información de la persona		`Object`	NO
`payment_details.shipping.location.line_1`	Dirección 1	Cadena alfanumérica	`String`	NO
`payment_details.shipping.location.line_2`	Dirección 2	Cadena alfanumérica	`String`	NO
`payment_details.shipping.location.city`	Ciudad	Cadena alfanumérica	`String`	NO
`payment_details.shipping.location.state`	Estado	Cadena alfanumérica	`String`	NO
`payment_details.shipping.location.country`	Pais	Cadena alfanumérica	`String`	NO

Ejemplo

JS

var payload = {
            "action": "authorize",
            "channel": "ecommerce",
            "merchant_code": "b0deb6f3-e51a-48a7-9268-f1441d46f7bd",
            "merchant_operation_number": "221354",
            "payment_details": {
                "amount": "7000",
                "currency": "604",
                "billing": {
                    "first_name": "Levis",
                    "last_name": "Silvestre",
                    "email": "levis.silvestre@alignet.com",
                    "phone": {
                        "country_code": "+51",
                        "subscriber": "958435685"
                    },
                    "location": {
                        "line_1": "Av. San Borja Norte 1743",
                        "line_2": "",
                        "city": "Lima",
                        "state": "Lima",
                        "country": "Peru"
                    }
                },
                "shipping": {
                    "first_name": "Levis",
                    "last_name": "Silvestre",
                    "email": "levis.silvestre@alignet.com",
                    "phone": {
                        "country_code": "+51",
                        "subscriber": "958435685"
                    },
                    "location": {
                        "line_1": "Av. San Borja Norte 1743",
                        "line_2": "",
                        "city": "Lima",
                        "state": "Lima",
                        "country": "Peru"
                    }
                },
                "customer": {
                    "first_name": "Levis",
                    "last_name": "Silvestre",
                    "email": "levis.silvestre@alignet.com",
                    "phone": {
                        "country_code": "+51",
                        "subscriber": "958435685"
                    },
                    "identity_document": {
                        "country": "PER",
                        "type": "DNI",
                        "identifier": "72661927"
                    },
                    "location": {
                        "line_1": "Av. San Borja Norte 1743",
                        "line_2": "",
                        "city": "Lima",
                        "state": "Lima",
                        "country": "Peru"
                    }
                }
            }
        }

var paymentForm = new FlexPaymentForms({ 
	"nonce":"eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJBbGlnbmV0IEpXVCBCdWlsZGVyIiwiaWF0IjoxNzEwNTQzMDAyLCJleHAiOjE3MTA1NDMwMzIsImF1ZCI6Imh0dHBzOi8vYXBpLmRldi5hbGlnbmV0LmlvIiwic3ViIjoiejhXd0FWN3JkMmpDVTBTaXZ3dFFWdjk0MWtxWmNFb3UiLCJub25jZSI6IjA0OTIwZTZjLTI0ZTgtNDYzMC05MmVkLWUxMjA2ZDg5YTNjZSIsInNjb3BlIjoiY3JlYXRlOnRva2VuIHBvc3Q6Y2hhcmdlcyB0ZXN0IiwiZ3R5IjoiY2xpZW50X2NyZWRlbnRpYWxzIn0.eOK4e_i6QaNuNlUd1or28qbPNyI3pRq19Cj-eGxqJs8", 
	"payload": payload, 
	"display_settings": {
		methods: ['QR','BANK_TRANSFER','CARD']
	}
});