¿Cómo usar GraphQL en Magento 2? [en el ejemplo de la extensión de la tarjeta de regalo]

Anteriormente, ya explicamos qué es GraphQL y cómo funciona . Y hoy, queremos ver de cerca cómo puede usarlo en Magento 2. Para esto, tomaremos nuestro complemento de Tarjeta de regalo como ejemplo y profundizaremos en consultas y mutaciones.

Resumen del artículo [ ocultar ]

  • GiftCardGraphQL
  • La consulta amGiftCardAccount
  • Mutaciones
    • aplicarAmGiftCardToCart / removeAmGiftCardFromCart
    • añadirAmGiftCardProductsToCart
  • Otros ejemplos del uso de la tarjeta de regalo

GiftCardGraphQL

GiftCardGraphQL incluye 1 consulta y 3 mutaciones.

La consulta tiene el nombre amGiftCardAccount y es responsable de la información sobre el producto de la tarjeta de regalo:

La mutación addAmGiftCardProductsToCart agrega un producto de tarjeta de regalo al carrito:

La mutación applyAmGiftCardToCart aplica el código al carrito:

Para eliminar el código de la tarjeta de regalo del carrito, use la mutación removeAmGiftCardFromCart :

Considerémoslos específicamente.

La consulta amGiftCardAccount

Como mencionamos anteriormente, la consulta amGiftCardAccount le permite obtener información sobre la tarjeta de regalo por su código único. Para crear una solicitud, necesitamos saber el código de la tarjeta de regalo. Puede obtenerlo en el backend de Magento. Para ello, vaya a Marketing > Tarjetas de regalo > Cuentas y copie el Código de tarjeta de regalo necesario :

Ahora, puedes hacer una solicitud:

En la primera columna, puede ver nuestra solicitud. Lo formamos a partir de las opciones que están disponibles para esta consulta. A partir de ahora, la lista completa de los campos disponibles se muestra en la tercera columna.

Como resultado, obtuvimos una respuesta en la columna del medio. Puede comparar los datos recibidos con la información en el panel de administración. Ellos son iguales.

Mutaciones

aplicarAmGiftCardToCart / removeAmGiftCardFromCart

Para aplicar o eliminar la tarjeta de regalo en el carrito, puede usar las mutaciones applyAmGiftCardToCart y removeAmGiftCardFromCart correspondientemente.

Antes de realizar una solicitud, debe obtener una ID de carrito a través de la mutación createEmptyCart :

Luego, agregue productos al carrito, utilizando el ID recibido, el SKU del producto y la cantidad:

El producto se añade al carrito:

Ahora, puede usar nuestra mutación applyAmGiftCardToCart . Para ello, necesita el ID del carrito recibido de la mutación createEmptyCart y el código de la tarjeta de regalo:

En esta captura de pantalla, puede ver nuestra solicitud, respuesta y la lista completa de las opciones de mutación de applyAmGiftCardToCart .

La opción added_am_gift_cards incluye información completa sobre los códigos de regalo aplicados al carrito. Puede usarlo en cualquier solicitud relacionada con el carrito.

Para restablecer la tarjeta de regalo, use una solicitud similar con la mutación removeAmGiftCardFromCart :

añadirAmGiftCardProductsToCart

El addAmGiftCardProductsToCart se usa para agregar un producto de tarjeta de regalo al carrito.

Antes de realizar la solicitud, debe crear un nuevo producto de tarjeta de regalo en su backend de Magento 2 guiado por nuestro tutorial .

Para esto, vaya a Productos > Catálogo , haga clic en Agregar producto y elija Tarjeta de regalo Pro en el menú desplegable. Luego, elija el tipo de tarjeta , el conjunto de códigos de la tarjeta de regalo y la imagen de la tarjeta de regalo :

Complete los detalles del producto:

Establecer precios:

Y verifique el resultado en la interfaz:

A continuación, obtenga una ID de carrito a través de la mutación createEmptyCart , exactamente como lo hicimos antes:

Para agregar el producto de la tarjeta de regalo, necesitará no solo el ID del carrito, el SKU del producto y la cantidad, sino también gift_card_options . Este bloque es obligatorio y consta de opciones de tarjetas de regalo que puede encontrar en la 3.ª columna.

Para obtener la lista de opciones elegidas, debe usar el bloque … en AmGiftCardCartItem . En am_giftcard_options , puede especificar el código de salida , la etiqueta y el valor de cada opción.

Otros ejemplos del uso de la tarjeta de regalo

El producto de la tarjeta de regalo está disponible para todas las solicitudes de productos . Por ejemplo, intentemos realizar una solicitud de búsqueda con nuestro producto de tarjeta de regalo creado. Para mostrar las propiedades del producto de la tarjeta de regalo, puede utilizar el bloque … en AmGiftCardProduct . Así es como puede verse:

Todas las opciones disponibles se enumeran en la tercera columna.


Eso es todo por el artículo de hoy.

Espero que ahora esté más claro cómo usar GraphQL en Magento 2. Pero si tiene alguna pregunta, no dude en comentar a continuación. Haremos todo lo posible para ayudarte.