# Интеграция с Marketo
В этом руководстве объясняется, как интегрировать [Marketo](https://login.marketo.com/) с Pushwoosh. Вы сможете использовать канал коммуникации Web Push Notifications в рамках ваших маркетинговых кампаний в Marketo.
Например, представьте, что пользователь посетил вашу целевую страницу Marketo, но не совершил на ней никаких действий. Вы сможете связаться с этим пользователем с помощью веб-пуш-уведомления в качестве напоминания. Это веб-пуш-уведомление также можно персонализировать с помощью данных Marketo, записанных для этого пользователя, для максимального вовлечения!
## 1. Создание Service Worker
Следуйте этому [руководству](/ru/developer/pushwoosh-sdk/web-push-notifications/web-push-sdk-30) и выполните **предварительные шаги** и шаги **1 - 2.2.**
После выполнения вышеуказанных шагов у вас под рукой должны быть готовые файлы _manifest.json_ и _pushwoosh-service-worker.js_.
Переключитесь в **Marketo Design Studio**.
Marketo может загружать файлы только в папку ресурсов, которая называется "Images and Files".
Загрузите _manifest.json_ и _pushwoosh-service-worker.js_ в эту папку.
## 2. Создание страницы подписки на пуш-уведомления
Как упоминалось выше, Marketo может загружать файлы только в папку ресурсов, которая отличается от области видимости целевых страниц.
Например, если вы нажмете на любой загруженный выше файл и проверите его URL, вы увидите что-то вроде "[https://your-host-name.com/rs/765-IWA-819/images/pushwoosh-service-worker.js](https://your-host-name.com/rs/765-IWA-819/images/pushwoosh-service-worker.js)".
Однако, если вы нажмете на целевую страницу и проверите ее URL, он будет выглядеть примерно так: "[https://your-host-name.com/lp/765-IWA-819/pushwoosh-landing.html](https://your-host-name.com/lp/765-IWA-819/pushwoosh-landing.html)".
Обратите внимание на часть **"lp"** в URL целевых страниц и **"rs"** в URL скриптов.
Это означает, что нам нужно зарегистрировать наш скрипт _Service Worker_ в области видимости, отличной от целевых страниц.
Чтобы этого добиться, мы загрузим специальную страницу подписки на пуш-уведомления в папку ресурсов Marketo, а затем откроем ее с целевой страницы. Давайте создадим эту страницу подписки.
Получите файл _push-subscription.html_ из следующего gist:
[https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-push-subscription-html](https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-push-subscription-html)
Откройте файл и измените следующие строки:
* Строка 8 - измените ссылку на URL файла _manifest.json_, загруженного на предыдущем шаге.
* Строка 24 - измените значение параметра _scope_ на URL вашей папки ресурсов (это папка, где находится _manifest.json_).
* Строка 20 - измените значение параметра _applicationCode_ на ваш Pushwoosh App Id.
Обратите внимание, что скрипт также сопоставляет ориентированные на пользователя пуш-уведомления Pushwoosh с идентификатором лида (Lead Identifier) Marketo: _userId:leadId_ (строка 26)
Загрузите полученный файл в папку "Images and Files". Теперь у вас в этой папке должны быть следующие файлы:
## 3. Создание целевой страницы с подпиской на пуш-уведомления
Получите файл _pushwoosh-template.html_ из следующего gist:
[https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-pushwoosh-template-html](https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-pushwoosh-template-html)
Откройте файл и измените следующие строки:
* Строка 47 - измените значение параметра _scope_ на URL вашей папки ресурсов.
* Строка 65 - измените ссылку на URL файла _push-subscription.html_, загруженного на предыдущем шаге.
* Строка 43 - измените значение параметра _applicationCode_ на ваш Pushwoosh App Id.
Этот скрипт, как и предыдущий, также сопоставляет ориентированные на пользователя пуш-уведомления Pushwoosh с идентификатором лида (Lead Identifier) Marketo: _userId:leadId_ (строка 49)
Теперь перейдите в раздел "**Templates**" ваших **целевых страниц Marketo**, создайте шаблон (на скриншоте ниже он называется "pushwoosh-template") и скопируйте туда содержимое полученного файла.
Теперь давайте создадим новую целевую страницу на основе этого шаблона.
В нашем примере, чтобы для простоты показать возможности интеграции Pushwoosh с автоматизацией кампаний Marketo, мы добавим простую ссылку на целевую страницу. Мы собираемся создать кампанию, которая будет запускать персональное пуш-уведомление, когда пользователь нажимает на эту ссылку.
Мы будем использовать тот же URL, что и у целевой страницы.
```txt
Пришлите мне предложение!
```
## 4. Создание Webhook Pushwoosh
Перейдите в раздел **"Admin" в Marketo** и создайте новый Webhook со следующими параметрами:
* URL - [https://go.pushwoosh.com/json/1.3/createMessage](https://go.pushwoosh.com/json/1.3/createMessage)
* Тип запроса: POST
Вставьте следующий код в качестве шаблона.
```
{
"request": {
"application": "ВВЕДИТЕ_ВАШ_PUSHWOOSH_APP_ID",
"auth": "ВВЕДИТЕ_ВАШ_PUSHWOOSH_API_TOKEN",
"notifications": [{
"send_date": "now",
"ignore_user_timezone": true,
"content": "У нас для вас новое предложение!",
"users" : ["{{lead.Id:default="ABCD-EFGH"}}"]
}]
}
}
```
Обратите внимание, что мы используем Marketo Lead ID для обращения к пользователю в Pushwoosh. Подробнее об ориентированных на пользователя пуш-уведомлениях читайте [здесь](/ru/product/messaging-channels/push-notifications/send-push-notifications/push-by-user-id).
В нашем очень простом примере мы используем статическое пуш-сообщение. Однако вы можете использовать всю функциональность [`createMessage`](/ru/developer/api-reference/messages-api/#createmessage)
Для персонализации пуш-уведомлений вы можете использовать **Preset** из Pushwoosh и передавать значения из Marketo в параметрах **"dynamic_content_placeholders"** вызова `/createMessage` для персонализации пушей.
## 5. Интеграция с кампанией автоматизации Marketo
Перейдите в раздел "**Marketing Activities**" в Marketo и создайте кампанию.
В нашем примере мы будем запускать кампанию, когда пользователь нажимает на ссылку (ту, которую мы создали двумя шагами выше) на нашей целевой странице.
b. Выберите Webhook "send_push" в разделе "Flow"
* Теперь откройте URL целевой страницы
* Нажмите на кнопку **"Да, хочу"**, чтобы открыть диалоговое окно подписки на пуш-уведомления
* Подпишитесь на пуш-уведомления
* Нажмите на ссылку **"Пришлите мне предложение!"**
Вы получили свое автоматизированное пуш-уведомление от Marketo!
## 2. Создание страницы подписки на пуш-уведомления
Как упоминалось выше, Marketo может загружать файлы только в папку ресурсов, которая отличается от области видимости целевых страниц.
Например, если вы нажмете на любой загруженный выше файл и проверите его URL, вы увидите что-то вроде "[https://your-host-name.com/rs/765-IWA-819/images/pushwoosh-service-worker.js](https://your-host-name.com/rs/765-IWA-819/images/pushwoosh-service-worker.js)".
Однако, если вы нажмете на целевую страницу и проверите ее URL, он будет выглядеть примерно так: "[https://your-host-name.com/lp/765-IWA-819/pushwoosh-landing.html](https://your-host-name.com/lp/765-IWA-819/pushwoosh-landing.html)".
Обратите внимание на часть **"lp"** в URL целевых страниц и **"rs"** в URL скриптов.
Это означает, что нам нужно зарегистрировать наш скрипт _Service Worker_ в области видимости, отличной от целевых страниц.
Чтобы этого добиться, мы загрузим специальную страницу подписки на пуш-уведомления в папку ресурсов Marketo, а затем откроем ее с целевой страницы. Давайте создадим эту страницу подписки.
Получите файл _push-subscription.html_ из следующего gist:
[https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-push-subscription-html](https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-push-subscription-html)
Откройте файл и измените следующие строки:
* Строка 8 - измените ссылку на URL файла _manifest.json_, загруженного на предыдущем шаге.
* Строка 24 - измените значение параметра _scope_ на URL вашей папки ресурсов (это папка, где находится _manifest.json_).
* Строка 20 - измените значение параметра _applicationCode_ на ваш Pushwoosh App Id.
Обратите внимание, что скрипт также сопоставляет ориентированные на пользователя пуш-уведомления Pushwoosh с идентификатором лида (Lead Identifier) Marketo: _userId:leadId_ (строка 26)
Загрузите полученный файл в папку "Images and Files". Теперь у вас в этой папке должны быть следующие файлы:
## 3. Создание целевой страницы с подпиской на пуш-уведомления
Получите файл _pushwoosh-template.html_ из следующего gist:
[https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-pushwoosh-template-html](https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-pushwoosh-template-html)
Откройте файл и измените следующие строки:
* Строка 47 - измените значение параметра _scope_ на URL вашей папки ресурсов.
* Строка 65 - измените ссылку на URL файла _push-subscription.html_, загруженного на предыдущем шаге.
* Строка 43 - измените значение параметра _applicationCode_ на ваш Pushwoosh App Id.
Этот скрипт, как и предыдущий, также сопоставляет ориентированные на пользователя пуш-уведомления Pushwoosh с идентификатором лида (Lead Identifier) Marketo: _userId:leadId_ (строка 49)
Теперь перейдите в раздел "**Templates**" ваших **целевых страниц Marketo**, создайте шаблон (на скриншоте ниже он называется "pushwoosh-template") и скопируйте туда содержимое полученного файла.
Теперь давайте создадим новую целевую страницу на основе этого шаблона.
В нашем примере, чтобы для простоты показать возможности интеграции Pushwoosh с автоматизацией кампаний Marketo, мы добавим простую ссылку на целевую страницу. Мы собираемся создать кампанию, которая будет запускать персональное пуш-уведомление, когда пользователь нажимает на эту ссылку.
Мы будем использовать тот же URL, что и у целевой страницы.
```txt
Пришлите мне предложение!
```
## 4. Создание Webhook Pushwoosh
Перейдите в раздел **"Admin" в Marketo** и создайте новый Webhook со следующими параметрами:
* URL - [https://go.pushwoosh.com/json/1.3/createMessage](https://go.pushwoosh.com/json/1.3/createMessage)
* Тип запроса: POST
Вставьте следующий код в качестве шаблона.
```
{
"request": {
"application": "ВВЕДИТЕ_ВАШ_PUSHWOOSH_APP_ID",
"auth": "ВВЕДИТЕ_ВАШ_PUSHWOOSH_API_TOKEN",
"notifications": [{
"send_date": "now",
"ignore_user_timezone": true,
"content": "У нас для вас новое предложение!",
"users" : ["{{lead.Id:default="ABCD-EFGH"}}"]
}]
}
}
```
Обратите внимание, что мы используем Marketo Lead ID для обращения к пользователю в Pushwoosh. Подробнее об ориентированных на пользователя пуш-уведомлениях читайте [здесь](/ru/product/messaging-channels/push-notifications/send-push-notifications/push-by-user-id).
В нашем очень простом примере мы используем статическое пуш-сообщение. Однако вы можете использовать всю функциональность [`createMessage`](/ru/developer/api-reference/messages-api/#createmessage)
Для персонализации пуш-уведомлений вы можете использовать **Preset** из Pushwoosh и передавать значения из Marketo в параметрах **"dynamic_content_placeholders"** вызова `/createMessage` для персонализации пушей.
## 5. Интеграция с кампанией автоматизации Marketo
Перейдите в раздел "**Marketing Activities**" в Marketo и создайте кампанию.
В нашем примере мы будем запускать кампанию, когда пользователь нажимает на ссылку (ту, которую мы создали двумя шагами выше) на нашей целевой странице.
b. Выберите Webhook "send_push" в разделе "Flow"
* Теперь откройте URL целевой страницы
* Нажмите на кнопку **"Да, хочу"**, чтобы открыть диалоговое окно подписки на пуш-уведомления
* Подпишитесь на пуш-уведомления
* Нажмите на ссылку **"Пришлите мне предложение!"**
Вы получили свое автоматизированное пуш-уведомление от Marketo!
