• Francia
página de estado
demo
asistencia
FAQContacte el soporte tecnico
Buscar
Categoria
Tags
España
Francia
España
Europa (Inglés)
India
Página principal
Casos de uso
Crear un pago
Crear un pago en vencimientos
Crear un pago multitarjeta
Crear un pago por token
Crear un enlace de pago
Crear una suscripción
Gestione sus suscripciones
Gestione sus transacciones
Analizar los diarios
Docs API
Formulario incrustado
API REST
Formulario en redirección
Pago móvil
Intercambio de ficheros
Ejemplo de código
Medios de pago
Plugins
Guías
Back office Experto
Guías funcionales

Pop-in: Probar rápidamente

Esta página ofrece una visión general rápida de cómo insertar un formulario de pago seguro dentro de un pop-in, en 3 simples pasos.

Para una guía de integración más completa, consulte: Inicio: Pago simple

El formulario pop-in y el formulario incrustado se integran de la misma manera. Solo debe agregar la directriz kr-popin en la div

:
.

1. Crear el formToken

  1. Cree una solicitud de pago hacia el Web ServiceCharge/CreatePayment.
  • Ejemplo de pago simple:
    • monto: 9,90€.
    • pedido: "myOrderId-999999"
    • e-mail del comprador: "sample@example.com ".
  1. Por defecto, se ofrecen todos los medios de pago compatibles asociados a la tienda (en función de la divisa, el monto mínimo o máximo y las restricciones técnicas). Si desea filtrar los medios de pago, consulte: Seleccionar los medios de pago.

2. Mostrar el formulario

Una vez generado el formToken, muestre el formulario de pago.

  1. En elHEAD,

  • cargue nuestra biblioteca JavaScript : src="https://static.lyra.com/static/js/krypton-client/V4.0/stable/kr-payment-form.min.js"

  • Debe incluir la clave pública en el parámetro kr-public-key ( tercera clave en la tabla de claves de la API REST ).

  • Incluya otros parámetros de inicialización , como el parámetro kr-post-url-success en caso de pago exitoso ( Paso 4: Mostrar el formulario de pago )

    • Ejemplo : kr-post-url-success ="[SUCCESS PAYMENT URL]"

  • elija un tema (más información en Temas ).

  1. En elBODY,

  • elija el modo de visualización :

    • con laclass=kr-embeddedpor elmodo incrustado(Modo incrustado)
    • con laclass=kr-embeddedy el atributokr-popinpor elmodo pop-in(Modo pop-in)

  • establezca el valor del formToken en el atributo kr-form-token

Modo incrustado

Ejemplo de código para la tienda TEST

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />

<!-- STEP :
1 : load the JS librairy
2 : required public key and the JS parameters as url sucess -->

<script type="text/javascript"
        src="https://static.lyra.com/static/js/krypton-client/V4.0/stable/kr-payment-form.min.js"
        kr-public-key="69876357:testpublickey_DEMOPUBLICKEY95me92597fd28tGD4r5"
        kr-post-url-success="[SUCCESS PAYMENT URL]";>
 </script>

 <!-- 3 : theme néon should be loaded in the HEAD section   -->
<link rel="stylesheet" href="https://static.lyra.com/static/js/krypton-client/V4.0/ext/neon-reset.min.css">
<script type="text/javascript" src="https://static.lyra.com/static/js/krypton-client/V4.0/ext/neon.js">
    </script>
</head>

<body>

<!-- 4 : display the form payment -->
<div class="kr-embedded" kr-form-token="[GENERATED FORMTOKEN]">

</div>
</body>
</html>

Ejemplo de formulario de pago funcional:

El formulario es funcional, usted puede realizar un pago con las tarjetas de test de la barra de debug (ver abajo a la izquierda de esta ventana).

3. Verificar el estado de la transacción

Al finalizar el pago, puede analizar el resultado del mismo desde:

  • Notificación de pago instantáneo: IPN: Análisis de la Instituto Nacional de Políticas Públicas (URL de notificación) .
  • la respuesta enviada al navegador: Análisis del resultado del pago mediante devolución a la tienda.

Un mecanismo de seguridad verifica la autenticidad de la información enviada, con el kr-hash.

En el objeto PAYMENT, un ejemplo de kr-answer, :

{
  "shopId": "69876357",
  "orderCycle": "CLOSED",
  "orderStatus": "PAID",
  "serverDate": "2022-01-21T09:28:17+00:00",
  "orderDetails": {
    "orderTotalAmount": 990,
    "orderEffectiveAmount": 990,
    "orderCurrency": "EUR",
    "mode": "TEST",
    "orderId": "myOrderId-475882",
    "metadata": null,
    "_type": "V4/OrderDetails"
  },
  "customer": {
    "billingDetails": {
      "address": null,
      "category": null,
      "cellPhoneNumber": null,
      "city": null,
      "country": null,
      "district": null,
      "firstName": null,
      "identityCode": null,
      "language": "FR",
      "lastName": null,
      "phoneNumber": null,
      "state": null,
      "streetNumber": null,
      "title": null,
      "zipCode": null,
      "legalName": null,
      "_type": "V4/Customer/BillingDetails"
    },
    "email": "sample@example.com",
    "reference": null,
    "shippingDetails": {
      "address": null,
      "address2": null,
      "category": null,
      "city": null,
      "country": null,
      "deliveryCompanyName": null,
      "district": null,
      "firstName": null,
      "identityCode": null,
      "lastName": null,
      "legalName": null,
      "phoneNumber": null,
      "shippingMethod": null,
      "shippingSpeed": null,
      "state": null,
      "streetNumber": null,
      "zipCode": null,
      "_type": "V4/Customer/ShippingDetails"
    },
    "extraDetails": {
      "browserAccept": null,
      "fingerPrintId": null,
      "ipAddress": "185.244.73.2",
      "browserUserAgent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36",
      "_type": "V4/Customer/ExtraDetails"
    },
    "shoppingCart": {
      "insuranceAmount": null,
      "shippingAmount": null,
      "taxAmount": null,
      "cartItemInfo": null,
      "_type": "V4/Customer/ShoppingCart"
    },
    "_type": "V4/Customer/Customer"
  },
  "transactions": [
    {
      "shopId": "69876357",
      "uuid": "1c8356b0e24442b2acc579cf1ae4d814",
      "amount": 990,
      "currency": "EUR",
      "paymentMethodType": "CARD",
      "paymentMethodToken": null,
      "status": "PAID",
      "detailedStatus": "AUTHORISED",
      "operationType": "DEBIT",
      "effectiveStrongAuthentication": "ENABLED",
      "creationDate": "2022-01-21T09:28:16+00:00",
      "errorCode": null,
      "errorMessage": null,
      "detailedErrorCode": null,
      "detailedErrorMessage": null,
      "metadata": null,
      "transactionDetails": {
        "liabilityShift": "YES",
        "effectiveAmount": 990,
        "effectiveCurrency": "EUR",
        "creationContext": "CHARGE",
        "cardDetails": {
          "paymentSource": "EC",
          "manualValidation": "NO",
          "expectedCaptureDate": "2022-01-27T09:38:10+00:00",
          "effectiveBrand": "VISA",
          "pan": "497011XXXXXX1003",
          "expiryMonth": 12,
          "expiryYear": 2025,
          "country": "FR",
          "issuerCode": 17807,
          "issuerName": "Banque Populaire Occitane",
          "effectiveProductCode": null,
          "legacyTransId": "929936",
          "legacyTransDate": "2022-01-21T09:28:16+00:00",
          "paymentMethodSource": "NEW",
          "authorizationResponse": {
            "amount": 990,
            "currency": "EUR",
            "authorizationDate": "2022-01-21T09:28:16+00:00",
            "authorizationNumber": "3fe205",
            "authorizationResult": "0",
            "authorizationMode": "FULL",
            "_type": "V4/PaymentMethod/Details/Cards/CardAuthorizationResponse"
          },
          "captureResponse": {
            "refundAmount": null,
            "refundCurrency": null,
            "captureDate": null,
            "captureFileNumber": null,
            "effectiveRefundAmount": null,
            "effectiveRefundCurrency": null,
            "_type": "V4/PaymentMethod/Details/Cards/CardCaptureResponse"
          },
          "threeDSResponse": {
            "authenticationResultData": {
              "transactionCondition": null,
              "enrolled": null,
              "status": null,
              "eci": null,
              "xid": null,
              "cavvAlgorithm": null,
              "cavv": null,
              "signValid": null,
              "brand": null,
              "_type": "V4/PaymentMethod/Details/Cards/CardAuthenticationResponse"
            },
            "_type": "V4/PaymentMethod/Details/Cards/ThreeDSResponse"
          },
          "authenticationResponse": {
            "id": "30eaa40d-dd76-4617-b527-4bed6240b81c",
            "operationSessionId": "ae6f2ad3ffea41bb8faf1aefabad87b9",
            "protocol": {
              "name": "THREEDS",
              "version": "2.1.0",
              "network": "VISA",
              "challengePreference": "NO_PREFERENCE",
              "simulation": true,
              "_type": "V4/Charge/Authenticate/Protocol"
            },
            "value": {
              "authenticationType": "CHALLENGE",
              "authenticationId": {
                "authenticationIdType": "dsTransId",
                "value": "bafdb21f-e3d6-4d1c-b4f6-d1668b7f7f21",
                "_type": "V4/Charge/Authenticate/AuthenticationId"
              },
              "authenticationValue": {
                "authenticationValueType": "CAVV",
                "value": "BqLgDBHYRaCBpip3Fn3+erKT9vg=",
                "_type": "V4/Charge/Authenticate/AuthenticationValue"
              },
              "status": "SUCCESS",
              "commerceIndicator": "05",
              "extension": {
                "authenticationType": "THREEDS_V2",
                "threeDSServerTransID": "30eaa40d-dd76-4617-b527-4bed6240b81c",
                "dsTransID": "bafdb21f-e3d6-4d1c-b4f6-d1668b7f7f21",
                "acsTransID": "bd6e58b4-6f37-4993-b428-9096766d83a6",
                "_type": "V4/Charge/Authenticate/AuthenticationResultExtensionThreedsV2"
              },
              "reason": {
                "_type": "V4/Charge/Authenticate/AuthenticationResultReason"
              },
              "_type": "V4/Charge/Authenticate/AuthenticationResult"
            },
            "_type": "V4/AuthenticationResponseData"
          },
          "installmentNumber": null,
          "installmentCode": null,
          "markAuthorizationResponse": {
            "amount": null,
            "currency": null,
            "authorizationDate": null,
            "authorizationNumber": null,
            "authorizationResult": null,
            "_type": "V4/PaymentMethod/Details/Cards/MarkAuthorizationResponse"
          },
          "cardHolderName": null,
          "identityDocumentNumber": null,
          "identityDocumentType": null,
          "_type": "V4/PaymentMethod/Details/CardDetails"
        },
        "fraudManagement": {
          "_type": "V4/PaymentMethod/Details/FraudManagement"
        },
        "subscriptionDetails": {
          "subscriptionId": null,
          "_type": "V4/PaymentMethod/Details/SubscriptionDetails"
        },
        "parentTransactionUuid": null,
        "mid": "9999999",
        "sequenceNumber": 1,
        "taxAmount": null,
        "preTaxAmount": null,
        "taxRate": null,
        "externalTransactionId": null,
        "nsu": null,
        "tid": "001",
        "acquirerNetwork": "CB",
        "taxRefundAmount": null,
        "userInfo": "JS Client",
        "paymentMethodTokenPreviouslyRegistered": null,
        "occurrenceType": "UNITAIRE",
        "_type": "V4/TransactionDetails"
      },
      "_type": "V4/PaymentTransaction"
    }
  ],
  "subMerchantDetails": null,
  "_type": "V4/Payment"
}
Jobs
Legal
GDPR
25.25.0-1.11