Integración de Apple Pay JS en un sitio web

4 minutos de lectura

avatar de usuario
Martín Costello

Estoy buscando integrar Apple Pay en un sitio web usando el nuevo Apple paga JS SDK. Actualmente, la documentación es bastante mínima, solo se refiere a las declaraciones de API y cómo crear una instancia de un nuevo ApplePaySession objeto.

¿Hay algún código de ejemplo disponible todavía, o alguien lo ha implementado por sí mismo, mostrando el flujo típico de integración de API para una aplicación web?

Los únicos ejemplos que he podido encontrar para todos parecen ser las propias integraciones de SDK de Apple Pay de los proveedores de pago de terceros.

  • Lo siento si esta es una pregunta tonta, pero ¿dónde puedo encontrar la descarga de applepay.js? ¿O está de alguna manera disponible en XCode?

    – ceros

    27 de junio de 2016 a las 8:04


  • @nils Está integrado en el navegador Safari de la misma manera que la “ventana” está integrada en los navegadores. No hay archivos .js para extraer.

    – Martín Costello

    28/06/2016 a las 12:30

  • Ya entiendo, gracias. Está muy mal documentado :/

    – ceros

    28 de junio de 2016 a las 12:38

  • Incluso hoy, en la fecha de lanzamiento de iOS10, parece que alguien se detuvo a mitad de camino para documentarlo. puaj

    – Simón_Weaver

    13/09/2016 a las 12:30

  • Incluso hoy en 2019: apesta integrar y la documentación adecuada

    – Vaibhavraj Roham

    9 de enero de 2019 a las 6:23

He publicado un código de ejemplo de ApplePayJS de extremo a extremo en github aquí

https://github.com/norfolkmustard/ApplePayJS

Utiliza PHP para la parte del lado del servidor, necesaria para la validación inicial del proveedor para comenzar la transacción. El resto está en javascript.

ApplePayJS != efectivo en el banco, solo un medio para obtener una tarjeta de crédito tokenizada de un cliente. Entrega ese número de tarjeta a un procesador de pago de terceros como stripe.com, braintreepayments.com, authorize.net

Salud

  • ¡Esto es excelente! Gracias. El video de Apple sobre el tema no dejó en claro exactamente lo que estaba sucediendo durante la promesa onvalidatemerchant, pero su ejemplo es lo que asumí pero no estaba seguro.

    –Cory Fischer

    19 de octubre de 2016 a las 1:27

  • Esto puede tener 2 años, pero sigue siendo el único código de ejemplo que realmente llenó la última pieza del rompecabezas para mí para obtener una sesión comercial de Apple. Muchas gracias Stu.

    – dartaco

    13 de junio de 2018 a las 9:05

  • La URL de la sesión de pago de Apple Pay es: apple-pay-gateway-cert.apple.com/paymentservices/startSession a partir de diciembre de 2019, /paymentServices/paymentSession no funciona al menos para mí.

    – srk

    10 de diciembre de 2019 a las 21:13


avatar de usuario
Eugenio Hauptmann

La versión estable estará disponible este otoño probablemente.

Lo primero que debe hacer es asegurarse de que la API esté disponible en su navegador:

if(ApplePaySession)
   ApplePaySession.canMakePayments()

Entonces la transacción en sí:

var request = {
  countryCode: 'US',
  currencyCode: 'USD',
  supportedNetworks: ['visa', 'masterCard'],
  merchantCapabilities: ['supports3DS'],
  total: { label: 'Your Label', amount: '10.00' },
}
var session = new ApplePaySession(1, request);

Esto es del sitio web oficial sobre cómo comenzar: https://developer.apple.com/reference/applepayjs/applepaysession

Después de tener la sesión, puede controlarla:
ingrese la descripción de la imagen aquí

Y puede escuchar eventos y cambiar su flujo en función de ello:
ingrese la descripción de la imagen aquí

Estoy trabajando en la integración entre Apple Pay JS y Stripe API en este momento, así que publicaré una versión preliminar para GitHub este verano.

  • Además, aquí hay una “demostración de trabajo” con las piezas juntas: justindonnelly.github.io/applepayjs

    – Paul Irlandés

    27/07/2016 a las 18:33

  • @PaulIrish Nice, lograste que el botón Apple Pay funcionara bien. Tuve problemas con eso (se bloqueó la pestaña en la versión beta 2…).

    – Martín Costello

    28 de julio de 2016 a las 15:05

  • Desafortunadamente, esta demostración ya no funciona / no funciona y da El tipo de un objeto era incompatible con el tipo esperado del parámetro asociado al objeto como error Me pregunto si esto se debe a los cambios realizados en la versión beta pública de iOS.

    – Martín

    10 de agosto de 2016 a las 17:47

  • @Martin, ¿qué tipo de compilación de iOS/OS X está utilizando?

    –Eugène Hauptmann

    11 de agosto de 2016 a las 5:37

  • Beta 3 dejó obsoletas algunas propiedades “AddressesFields” -> “ContactFields”. Es posible que ahora sean errores, en lugar de advertencias.

    – Martín Costello

    11 de agosto de 2016 a las 15:57

La integración en la que he estado trabajando ahora finalmente se ha lanzado, y hay un entrada en el blog He escrito para ir junto con él, así como un Proyecto GitHub con un ejemplo de integración usando ASP.NET Core.

Espero que otros que hagan una integración de Apple Pay JS lo encuentren útil.

¿Ha sido útil esta solución?