🚀 Автоматическая отправка подписчиков рассылки из InstaWP в Mailchimp

Для Gato GraphQL мы используем InstaWP, чтобы позволить посетителям поиграть с коммерческими расширениями плагина в собственной sandbox-среде, прежде чем принять решение о покупке.

Два дня назад я обновил подписку InstaWP до плана Personal, чтобы увеличить срок жизни sandbox-сайтов с 4 часов до 7 дней и иметь возможность захватывать email-адреса подписчиков рассылки при тестировании Gato GraphQL:

Новый план открывает мне доступ к вкладке «Advanced Options», где я могу указать webhook, который будет получать данные вновь созданного sandbox-сайта:

Я хотел бы автоматически захватывать email посетителей, которые отметили флажок «Subscribe to mailing list», и сразу отправлять его в мой список Mailchimp — без какого-либо ручного вмешательства.

Документация по webhook приводит пример захвата данных нового sandbox-сайта с использованием платформы Make: там создаётся webhook, который извлекает поля payload и отправляет их в Google Sheet:

Make + InstaWP

Однако такой рабочий процесс не вполне отвечает моим потребностям: я не хочу зависеть от ещё одного стороннего сервиса и вводить там свои учётные данные Mailchimp. Мне нужно что-то проще.

Использование InstaWP + Gato GraphQL для передачи данных webhook

Решение буквально бросилось в глаза: я могу напрямую использовать InstaWP для размещения зарезервированного сайта и установить плагин Gato GraphQL с бандлом «Power Extensions».

Такая комбинация даёт мне экземпляр «API Gateway» с минимальными затратами. Теперь я могу использовать этот экземпляр для приёма payload webhook, извлечения данных и отправки их в Mailchimp, закодировав эту логику в GraphQL query.

Использование GraphQL поначалу может не казаться очевидным вариантом, потому что GraphQL-сервер обычно предоставляет один endpoint для приёма запроса, его обработки и возврата ответа. Хотя это и возможно, было бы очень неудобно использовать единственный endpoint в качестве URL webhook, передавая GraphQL query как параметр:

https://my-api-gateway.instawp.xyz/graphql/?query=query HasSubscribedToNewsletter { hasSubscriberOptIn: _httpRequestHasParam(name: "marketing_optin") subscriberOptIn: _httpRequestStringParam(name: "marketing_optin") isNotSubscriberOptInNAValue: _notEquals(value1: $__subscriberOptIn, value2: "NA") subscribedToNewsletter: _and(values: [$__hasSubscriberOptIn, $__isNotSubscriberOptInNAValue]) @export(as: "subscribedToNewsletter") } query MaybeCreateContactOnMailchimp @depends(on: "HasSubscribedToNewsletter") @include(if: $subscribedToNewsletter) { subscriberEmail: _httpRequestStringParam(name: "email") mailchimpUsername: _env(name: "MAILCHIMP_API_CREDENTIALS_USERNAME") @remove mailchimpPassword: _env(name: "MAILCHIMP_API_CREDENTIALS_PASSWORD") @remove mailchimpListMembersJSONObject: _sendJSONObjectItemHTTPRequest(input: { url: "https://us7.api.mailchimp.com/3.0/lists/bdfd6885fe/members", method: POST, options: { auth: { username: $__mailchimpUsername, password: $__mailchimpPassword }, json: { email_address: $__subscriberEmail, status: "subscribed" } } }) }

Не очень красиво, правда?

Gato GraphQL предлагает лучший способ справиться с этим: Persisted Queries. Persisted query похожа на REST-endpoint тем, что доступна по собственному URL, а её вывод предопределён (GraphQL query предоставляется заранее и хранится в базе данных):

Редактор persisted queries

Теперь URL webhook будет выглядеть так:

https://my-api-gateway.instawp.xyz/graphql-query/process-instawp-sandbox-webhook/?operationName=MaybeCreateContactOnMailchimp

А GraphQL query, сохранённая в виде Persisted query, выглядит следующим образом:

query HasSubscribedToNewsletter {
  hasSubscriberOptIn: _httpRequestHasParam(name: "marketing_optin")
  subscriberOptIn: _httpRequestStringParam(name: "marketing_optin")
  isNotSubscriberOptInNAValue: _notEquals(value1: $__subscriberOptIn, value2: "NA")
  subscribedToNewsletter: _and(values: [$__hasSubscriberOptIn, $__isNotSubscriberOptInNAValue])
    @export(as: "subscribedToNewsletter")
}
 
query MaybeCreateContactOnMailchimp
   @depends(on: "HasSubscribedToNewsletter")
   @include(if: $subscribedToNewsletter)
{
  subscriberEmail: _httpRequestStringParam(name: "email")
  
  mailchimpUsername: _env(name: "MAILCHIMP_API_CREDENTIALS_USERNAME")
    @remove
  mailchimpPassword: _env(name: "MAILCHIMP_API_CREDENTIALS_PASSWORD")
    @remove
  
  mailchimpListMembersJSONObject: _sendJSONObjectItemHTTPRequest(input: {
    url: "https://us7.api.mailchimp.com/3.0/lists/{listCode}/members",
    method: POST,
    options: {
      auth: {
        username: $__mailchimpUsername,
        password: $__mailchimpPassword
      },
      json: {
        email_address: $__subscriberEmail,
        status: "subscribed"
      }
    }
  })
}

Намного лучше, правда?

Теперь при создании нового sandbox-сайта на InstaWP, когда пользователь подписывается на рассылку, этот email автоматически добавляется в мой список Mailchimp:

Если вас интересует, как работает эта GraphQL query, читайте запись в блоге 👨🏻‍🏫 GraphQL query для автоматической отправки подписчиков рассылки из InstaWP в Mailchimp

🚀 Автоматическая отправка подписчиков рассылки из InstaWP в Mailchimp

​Использование InstaWP + Gato GraphQL для передачи данных webhook

Подпишитесь на нашу рассылку

Использование InstaWP + Gato GraphQL для передачи данных webhook