Как я могу отправить запрос API MailChimp через JavaScript в Google Tag Manager? - PullRequest
Новая
       22

Как я могу отправить запрос API MailChimp через JavaScript в Google Tag Manager?

0 голосов
/ 21 мая 2019

Я пытаюсь обновить участников MailChimp из Google Tag Manager, используя MailChimp API v3.0, но у меня возникают проблемы.Это мой код, который я запускаю с реального домена (не локального), защищенного действительным сертификатом SSL (если это имеет значение). 

const xmlHttp = new XMLHttpRequest();

xmlHttp.onreadystatechange = () => {
    try {
        if (xmlHttp.readyState !== 4) return;
        if (xmlHttp.status !== 200)
            throw new Error(
                xmlHttp.statusText || 'HTTP STATUS ' + xmlHttp.status
            );
        console.log(xmlHttp.responseText);
    } catch (err) {
        console.error(err);
    }
};

xmlHttp.open('POST', 'https://us12.api.mailchimp.com/3.0/lists/d5bed898ae/members/0740287eb1c63371a10d32ebf58391f9');
xmlHttp.setRequestHeader('Authorization', 'Basic ' + btoa('anystring' + ':' + 'my-api-key-here'));
xmlHttp.setRequestHeader('content-type', 'application/json');
xmlHttp.send('{"email_address":"user@example.com", "status":"subscribed", "member_rating":"4"}');

Я получаю ошибку CORS:

Access to XMLHttpRequest at 'https://us12.api.mailchimp.com/3.0/lists/d5bed898ae/members/0740287eb1c63371a10d32ebf58391f9' from origin 'https://subdomain.example.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Что я делаю не так?

ОБНОВЛЕНИЕ:

Примечание. Я не пытаюсь добавить нового участника, япытаюсь обновить существующий.Кроме того, ключ API не виден, я выбираю его как переменную GTM.Кроме того, код выполняется в домене, поскольку на страницу загружается GTM.

Где я должен запускать этот код?На серверах Mailchimp?Чего мне не хватает?

1 Ответ

0 голосов
/ 21 мая 2019

Прежде всего, EEK!Вы должны никогда помещать закрытый ключ API в клиентский код, в данном случае в GTM.Если посетитель веб-сайта заметил это, он мог бы легко использовать ваш ключ API, чтобы сделать практически все, что ему нужно, с вашей учетной записью Mailchimp, включая удаление всего, что в нем есть. Из документов Mailchimp :

Ключи API предоставляют полный доступ к вашей учетной записи Mailchimp и должны быть защищены так же, как и ваш пароль.

Если вы уже включили этот код в действие, даже на несколько минут, вам нужно немедленно отключить / отменить этот ключ API и создать новый.

Во-вторых, ошибка CORS вызвана тем, что MailChimpв частности, не поддерживает запросы API, которые отправляются в браузерах из-за пределов их собственного домена - например, запросы Cross-Origin, для которых требуется правильный заголовок ответа CORS.Причина этого та же, что и в моем предупреждении выше: вам не следует делать вызовы API из клиентского кода из-за рисков, связанных с безопасностью.На той же странице документации MailChimp они повторяют это предупреждение:

Из-за потенциальных угроз безопасности, связанных с раскрытием ключей API учетной записи, Mailchimp не поддерживает реализацию нашего API на стороне клиента с использованием запросов CORS или включаяКлючи API в мобильных приложениях.

См. Этот вопрос StackOverflow для аналогичного обсуждения.

Чтобы решить эту проблему, необходимо иметь действительный APIвызов поступает из фактического кода на стороне сервера.Большинство людей, вероятно, проксируют запрос через свой собственный сайт - поэтому, если ваш сайт - example.com, вы можете попросить GTM сделать AJAX-вызов example.com/mailchimp-proxy.php?action=update&list=d5bed898ae&user=0740287eb1c63371a10d32ebf58391f9&info=..., а затем этот PHP-скрипт в свою очередь вызовет фактическую конечную точку API https://us12.api.mailchimp.com/3.0/....с данными.Поскольку код работает на стороне сервера, если вы правильно в него вставите свой ключ, никто не сможет прочитать его.

Другой вариант - использовать что-то вроде Zapier или "«безсерверные» функции для прокси запроса, чтобы вам не нужно было запускать собственный сервер.

...