Документация Webitel

Создание чата в WhatsApp

1. Зайти на страницу https://developers.facebook.com/ и авторизоваться. 

  1. Нажать на "My Apps"(Рис. 1).

Главная страница (Meta).png
Рис. 1. Главная страница

3. Открывается страница "Приложения". Нажать на кнопку "Создать приложение" (Рис.2).

Страница Все приложения.png
Рис. 2. Страница "Приложения"

4. Открывается страница "Создание приложения" раздел "Тип". Выбрать тип приложения "Компания" и нажать кнопку "Далее", которая находится в конце страницы (Рис.3).

Страница Создание приложения раздел Тип.png
Рис. 3. Страница "Создание приложения" раздел "Тип"

5. Открывается страница "Создание приложения" раздел "Информация". Заполнить поле "Отображаемое значение". Нажать кнопку "Создание приложения"  (Рис.4).

Страница Создание приложения раздел Информация.png
Рис. 4. Страница "Создание приложения" раздел "Информация"

6. Открывается модальное окно для ввода пароля ещё раз. Необходимо ввести пароль и нажать кнопку "Отправить". Открывается страница добавление продуктов в приложение. Выбрать WhatsApp, нажать кнопку "Настроить" (Рис.5).

Выбор WhatsApp.png
Рис. 5. Выбор WhatsApp

7. Открывается страница "API платформы WhatsApp Business". Выбрать бизнес-аккаунт из выпадающего списка. Если его не выбрать, то бизнес-аккаунт создастся автоматически. Нажать кнопку "Далее" (Рис.6).

API платформы WhatsApp Business.png
Рис. 6. Выбор бизнес-аккаунта

8. Открывается страница "Быстрый старт". Нажать кнопку "Начать использовать API" (Рис.7).

Быстрый старт.png
Рис. 7. Страница "Быстрый старт"

9. Открывается страница "Первые шаги".

Временный маркер доступа (Рис. 8) не может быть использован.

Предназначен только для настройки тестового номера.

Регистрация и подключение собственных номеров рассмотрено ниже.

Первые шаги.png
Рис. 8. Временный маркер доступа

10. Зайти на https://business.facebook.com/. После приветствующих модульных окон выбирать нужный аккаунт и нажать в левой панели кнопку "Настройки" (Рис.9).

Левая панель.png
Рис. 9. Левая панель

11. Открывается страница "Настройки". В левой панели нажать кнопку "Настройки компании" (Рис.10).

Левая панель настроек.png
Рис. 10. Страница "Настройки"

12. Перейти на страницу "Системные пользователи". Нажать кнопку "Добавить" (Рис.11).

Системные пользователи.png
Рис. 11. Страница "Системные пользователи"

13. Нажать кнопку "Добавить". Прочесть и принять политику недискриминации от имени ваших системных пользователей нажав кнопку "Принимаю" в модальном окне (Рис.12). 

Политика недискриминации.png
Рис. 12. Политика недискриминации

14. Открывается модальное окно с информацией о принятии. Нажать кнопку "Готово" (Рис.13).

Принятие политики.png
Рис. 13. Модальное окно с информацией о принятии

15. Открывается модальное окно "Создать системного пользователя" (Рис.14).
       Вводим имя для нашего нового системного пользователя, к примеру "webitel".
       Указываем роль "Администратор". Нажимаем кнопку "Создать системного пользователя".

Создание системного пользователя.png
Рис. 14. Модальное окно "Создать системного пользователя"

16. Модальное окно закрывается открывается страница "Системные пользователи".
       Теперь нашему новому системному пользователю нужно предоставить доступ к нашему приложению.
       Нажать кнопку "Добавить объекты" (Рис. 15).

Страница Системные пользователи.png
Рис. 15. Страница "Системные пользователи"

17. Открывается модальное окно "Назначение объектов пользователю ...".

  • Тип оьекта: "Приложения".

  • Выбрать подключаемое приложение.

  • Предоставить доступ уровня: "Управление приложением".

Нажимаем кнопку "Сохранить изменения".

Вкладка Приложения.png
Рис. 16. Назначение объектов пользователю

18. Открывается модальное окно с оповещением о добавление ресурса (Рис.17). Нажать кнопку "Готово".

Ресурсы добавлены.png
Рис. 17. Ресурсы добавлены

19. Закрывается модальное окно. На странице "Системные пользователи" нажать кнопку "Создать новый маркер" (Рис.18).

Создать новый макет.png
Рис. 18. Страница "Системные пользователи"

20. Открывается модальное окно "Создание токена". Выбрать из выпадающего списка необходимое приложение.

Открываются доступные разрешения, из которых необходимо выбрать:

  • whatsapp_business_management

  • whatsapp_business_messaging

Нажать кнопку "Сгенерировать маркер"(Рис.19).

Генерирование маркера.png
Рис. 19. Генерирование маркера

21. Открывается модальное окно "Создание токена" с которого копируется маркер доступа для дальнейшего использования на стороне Webitel (Рис.20).

Сгенерированный маркер необходимо скопировать. После закрытия окна он станет недоступным для просмотра.

Такой маркер доступа позволить подключать/отключать только те аккаунты WhatsApp, к которым Вы предоставите доступ приложению от имени Вашего бизнеса.

Модальное окно Создание токена.png
Рис. 20. Модальное окно "Создание токена"

22. Для интеграции с Webitel необходимо создать текстовый шлюз, типа Meta.

Как создать текстовый шлюз Meta можно посмотреть здесь.

Если ваш номер телефона в настоящее время зарегистрирован в WhatsApp Messenger или приложении WhatsApp Business, вам необходимо сначала удалить его. Больше информации можно посмотреть здесь

Рекомендуется использовать номер телефона, на который не зарегистрировано аккаунт(ы) на других платформах WhatsApp.

23. Открыть в текстовом шлюзе вкладку "WhatsApp" (Рис.21). Вставить скопированный маркер доступа (Рис.20) в поле "Токен". Нажать кнопку "Сохранить".

Страница WhatsApp добавления токена.png
Рис. 21. Страница "Whatsapp"

24. Открыть страницу https://developers.facebook.com/ , перейдите в My Apps, выберите созданное ранее приложение для WhatsApp нажав на название. В левой колонке страницы, которая открылась, выбрать WhatsApp - Первые шаги (Рис.22).

WhatsApp - Первые шаги.png
Рис. 22. WhatsApp - Первые шаги

25. Открывается страница "Первые шаги". Нажать кнопку "Добавить номер телефона", которая расположена в конце страницы (Рис.23).

Добавить номер телефона.png
 Рис. 23. Страница "Первые шаги"

26. Открывается модальное окно "Укажите информацию о вашей компании" (Рис.24). Заполнить необходимые поля вводя информацию о вашей компании. Нажать кнопку "Далее".

Модальное окно Укажите информацию о вашей компании.png
Рис. 24. Модальное окно "Укажите информацию о вашей компании"

27. Открывается модальное окно "Создайте профиль WhatsApp Business" (Рис.25). Внести необходимые данные, нажать кнопку "Далее".

Модальное окно Создайте профиль WhatsApp Business.png
Рис. 25. Модальное окно "Создайте профиль WhatsApp Business"

28. Открывается модальное окно "Добавьте номер телефона для WhatsApp" (Рис.26). Выбрать код странны и ввести номер телефона. Выбрать способ подтверждения номера. Нажать кнопку "Далее".

Модальное окно Добавьте номер телефона для WhatsApp.png
Рис. 26. Модальное окно “Добавьте номер телефона для WhatsApp”

29. Открывается модальное окно "Подтвердите номер телефона" в котором необходимо ввести код подтверждения полученный по SMS (Рис.27). После ввода кода подтверждения кнопка "Далее" становится активной - нажать на неё.

Модальное окно Подтвердите номер телефона.png
Рис. 27. Модальное окно "Подтвердите номер телефона"

30. Модальное окно закрывается. Отображается страница "Первые шаги".
31. Перейти на Webitel. Открыть в текстовом шлюзе страницу "WhatsApp" (Рис.21). Нажать на кнопку "Добавить или удалить страницы". Откроется окно для входа в Facebook. Выполнить вход. Открывается окно "Какие аккаунты WhatsApp Business вы хотите использовать с приложением...?" (Рис.28). Выбрать созданный ранее аккаунт. Нажать кнопку "Далее".

Какие аккаунты WhatsApp Business вы хотите использовать с приложением....png
Рис. 28. Какие аккаунты WhatsApp Business вы хотите использовать с приложением...

32. Открывается окно "Что разрешено делать приложению...?" (Рис. 29). Поставить оба переключателя в активное положение. Нажать кнопку "Готово".

Что разрешено делать приложению....png
Рис. 29. Что разрешено делать приложению...

33. Открывается окно подтверждения связывания приложения (Рис. 30). Нажать кнопку "Ок".

Окно подтверждения связывания приложения.png
Рис. 30. Окно подтверждения связывания приложения

34. Окно закрывается, обновляются данные в реестре записей. на странице "WhatsApp". В реестре отображается добавленный номер. Переведите переключатель "Включено" в активное положение. Перейдите на страницу "Текстовые шлюзы", найдите текстовый шлюз в котором настраивался WhatsApp и переведите переключатель "Состояние" в активное положение.