Les 18: Interactie met externe diensten via webhooks

Een webhook is een op HTTP gebaseerde callback-functie die een externe dienst aanroept om een gebeurtenis te melden, waarbij een payload met gegevens wordt meegestuurd. Webhooks maken communicatie mogelijk tussen verschillende webapps en diensten.

Enkele voorbeelden van diensten die webhooks aanroepen:

• GitHub, wanneer een commit naar een repository wordt gepusht
• Dropbox, wanneer een document wordt bijgewerkt
• WooCommerce, wanneer een bestelling wordt geplaatst
• Microsoft Teams, om opgemaakte tekstberichten te ontvangen en in publieke kanalen te plaatsen
• ConvertKit, wanneer een abonnee wordt geactiveerd

Met Gato GraphQL kun je Persisted Queries maken die als webhooks fungeren:

• Omdat de Persisted Query beschikbaar is onder een eigen URL, kan deze worden gebruikt als doel voor de webhook
• Elke Persisted Query kan exclusief omgaan met een specifieke webhook

In deze tutorialles maken we een Persisted Query om te communiceren met ConvertKit.

​

De webhookdocumentatie doorbladeren

De eerste stap is het lezen van de documentatie van de website en begrijpen welke gegevens via de payload worden verzonden.

Bij analyse van webhooks in ConvertKit sturen abonnee-gerelateerde gebeurtenissen een POST-verzoek naar onze URL met een JSON-payload zoals deze:

{
  "subscriber": {
    "id": 1,
    "first_name": "John",
    "email_address": "John@example.com",
    "state": "active",
    "created_at": "2018-02-15T19:40:24.913Z",
    "fields": {
      "My Custom Field": "Value"
    }
  }
}Copy

​

Gegevens uit de payload extraheren

Omdat het verzoek via POST wordt verzonden, moeten we de gegevens uit de body van het HTTP-verzoek halen (wat wordt ondersteund via de HTTP Request via Schema extensie).

Deze GraphQL-query haalt de body van het verzoek op en converteert deze naar een JSON-object. Vervolgens extraheert het de items "subscriber.first_name" en "subscriber.email_address" uit het JSON-object en exporteert ze als dynamische variabelen:

query ExtractPayloadData {
  body: _httpRequestBody
  bodyJSONObject: _strDecodeJSONObject(string: $__body)
 
  subscriberFirstName: _objectProperty(
    object: $__bodyJSONObject,
    by: { path: "subscriber.first_name" }
  )
    @export(as: "subscriberFirstName")
  
  subscriberEmail: _objectProperty(
    object: $__bodyJSONObject,
    by: { path: "subscriber.email_address" }
  )
    @export(as: "subscriberEmail")
}Copy

​

Een actie uitvoeren met de gegevens

Zodra we de gegevens uit de payload hebben geëxtraheerd, kunnen we er een actie mee uitvoeren.

Deze GraphQL-query behandelt de gebeurtenis subscriber.subscriber_unsubscribe om een e-mail te sturen naar de persoon die zich heeft afgemeld, met het verzoek om feedback.

query CreateEmailMessage
  @depends(on: "ExtractPayloadData")
{
  emailMessageTemplate: _strConvertMarkdownToHTML(
    text: """
 
Hey {$subscriberFirstName}, it's sad to let you go!
 
Please be welcome to complete [this form](https://forms.gle/FpXNromWAsZYC1zB8) and let us know if there is anything we can do better.
 
Thanks. Hope to see you back!
 
    """
  )
  emailMessage: _strReplaceMultiple(
    search: ["{$subscriberFirstName}"],
    replaceWith: [$subscriberFirstName],
    in: $__emailMessageTemplate
  )
    @export(as: "emailMessage")
}
 
mutation SendEmail @depends(on: "CreateEmailMessage") {
  _sendEmail(
    input: {
      to: $subscriberEmail
      subject: "Would you like to give us feedback on how we can improve?"
      messageAs: {
        html: $emailMessage
      }
    }
  ) {
    status
  }
}Copy