Добавление рассылки с функциями Mailjet и Netlify

Я перешел из Mailchimp несколько лет назад, потому что стоимость должна была стать серьезным бременем, особенно после того, как они изменили способ расчета цен (все, с кем вы общались, даже если они отписались, и вам не разрешено общаться). В то время ActiveCampaign был более дешевым, но все же полнофункциональным вариантом. Тем не менее, мне никогда не были нужны все функции (особенно в отношении автоматизации кампаний), и снова пришло время, когда мне нужно двигаться. Как оказалось, переход с ActiveCampaign на Mailjet дает мне те функции, которые мне нужны, на 100 долларов меньше в месяц.

В этом посте я просто хочу поделиться кодом для добавления нового контакта в Mailjet через функцию Netlify.

Создание функции Netlify

Mailjet предоставляет JavaScript SDK, который на самом деле делает интеграцию с его API довольно простой. Вам понадобится ваш ключ API Mailjet и секретный ключ, которые вы можете найти в Mailjet в разделе «Account Settings», а затем выберите «API Key Management (основная и дополнительная учетная запись)» в REST API. Поместите их в переменную среды.

Одна причуда Mailjet заключается в том, что у вас могут быть контакты, но если они не добавлены в список, вы не можете отправлять им рассылки. Чтобы добавить их в список, вам понадобится идентификатор списка, который вы можете найти в разделе «Contacts», а затем «Contact Lists» в своей учетной записи. Я не помещал это в переменную среды, хотя мог бы. Это не конфиденциальная информация, но это может упростить управление. Однако стоит отметить, что у вас может быть несколько списков, и вы можете захотеть добавить пользователя более чем в один список.

Как вы увидите в приведенном ниже коде, процесс состоит из двух шагов:

• Добавьте пользователя в свои контакты и получите его новый идентификатор пользователя.
• Добавьте пользователя в соответствующие списки.
  

В остальном код довольно прост. Странно ли, что я использую then, а затем await в результате? Может быть, но это работает, и мне было легко к этому прийти.

const Mailjet = require("node-mailjet");

const mailjet = new Mailjet({
  apiKey: process.env.MAILJET_API_KEY,
  apiSecret: process.env.MAILJET_SECRET_KEY,
});
const listID = 12345678;

exports.handler = async (event, context, callback) => {
  try {
    if (!event.body) {
      return {
        statusCode: 500,
        body: "email query parameter required",
      };
    }
    const body = JSON.parse(event.body);
    const email = body.email;
    const firstName = body.firstName ? body.firstName : "";
    const lastName = body.lastName ? body.lastName : "";
    if (!email) {
      return {
        statusCode: 500,
        body: "email query parameter required",
      };
    }

    return mailjet
      .post("contact")
      .request({
        Email: email,
        IsExcludedFromCampaigns: false,
        Name: firstName + " " + lastName,
      })
      .then(async (res) => {
        const addedToList = mailjet
          .post("contact")
          .id(res.body.Data[0].ID)
          .action("managecontactslists")
          .request({
            ContactsLists: [
              {
                ListID: listID,
                Action: "addnoforce",
              },
            ],
          });
        const response = { msg: "Good news! You've been added." };
        return {
          statusCode: 200,
          body: JSON.stringify(response),
        };
      })
      .catch((err) => {
        console.log(err);
        const response = { errorMsg: err.response.statusText };
        return {
          statusCode: 200,
          body: JSON.stringify(response),
        };
      });
  } catch (err) {
    console.log(err);
    return { statusCode: 500, body: err.toString() };
  }
};

Следует отметить, что я возвращаю сообщение об ошибке от Mailjet, если пользователь не был добавлен в список, но, в отличие от ActiveCampaign, это не самое удобное для пользователя сообщение. Как правило, это если вы уже в списке, но, возможно, стоит проверить сообщения и ответить чем-то более дружелюбным (это в моем списке дел).

Использование функции

Итак, CFE — полностью статичный сайт, поэтому мне нужно вызвать эту функцию через клиентский JavaScript.

Каждая функция Netlify имеет URL-адрес, по которому вы можете опубликовать сообщение, так что это просто вопрос HTTP-запроса. Сценарий довольно прост, он добавляет в форму прослушиватель событий отправки, собирает данные, а затем использует Axios для выполнения запроса к функции. Нужен ли мне Axios? Нет, но это работает.

registerForm.addEventListener("submit", (e) => {
  e.preventDefault();

  let form = e.target;
  let name = form.elements["join-name"].value;
  let email = form.elements["join-email"].value;
  let firstName = "";
  let lastName = "";
  const errorMessage = document.getElementById("errorMessage");

  if (email === "") errorMessage.innerHTML = "Please fill in all fields";

  if (name !== "") {
    const nameArray = name.split(" ");
    if (nameArray.length) firstName = nameArray[0];

    if (nameArray.length > 1) {
      nameArray.shift();
      lastName = nameArray.join(" ");
    }
  }
  axios
    .post("/.netlify/functions/mailjet", {
      email: email,
      firstName: firstName,
      lastName: lastName,
    })
    .then(function (response) {
      if (response.data.errorMsg && errorMessage)
        errorMessage.innerHTML = response.data.errorMsg;
      else if (response.data.msg && errorMessage)
        errorMessage.innerHTML = response.data.msg;
    })
    .catch(function (error) {
      if (errorMessage) {
        errorMessage.innerHTML =
          "The request failed. Please try again in a moment.";
      } else {
        console.log("Failed to login user: %o", error);
        throw error;
      }
    });
});

Вот и все!

Так что здесь нет ничего революционного, и определенно есть способы улучшить код (это побочный проект, поэтому часто «это работает» — это все, на что у меня есть время). Но если вы ведете список рассылки и хотите использовать Mailjet, надеюсь, этот код вам поможет.